Angular 2 global component

angular angular2-components angular2-modules
user4676340 picture user4676340 · Jan 2, 2017 · Viewed 8.1k times · Source

My structure is as follows : 

App
    *component, module, template*
    Component 1
        *component, module, template*
        Component 11
            *component, module, template*
    Global Component
        *component, temaplte, BUT NO MODULE*

My App module contains the component 1 and component 11 modules. I declared the global component in the app module, so that I can use it in all my other components. I also exported it in app module.

But when I use the selector in the component 11 template, the console says not a known element.

I tried importing it in my other components but it says it's already imported, and that I should import it in a higher module.

Could you tell me how to declare a component so that it can be used in child templates ?

Answer

Karl picture Karl · Jan 2, 2017

I'd assume "global components" are not known in the angular 2 architecture. See also here ==> https://angular.io/docs/ts/latest/guide/architecture.html

From experience I know that it can be a problem if components (e.g. pipes) are imported at the app.module level. When doing this with a pipe for example you get a "pipe not found" error. Maybe you encounter a similiar problem with your component.

So I'd recommend to make your component part of a module and then import your module in your app.module instead of the component.

Related questions

How to access a component from different module in angular 2

I am new to angular 2, so please excuse me if this question sounds trivial to you. I am creating a feature module in angular 2 and I will export all the components from this module. Main module can import it and …

Read More
How to call another components function in angular2

I have two components as follows and I want to call a function from another component. Both components are included in the third parent component using directive. Component 1: @component( selector:'com1' ) export class com1{ function1(){...} } Component 2: @component( selector:'com2…

Read More
Angular - What is the meanings of module.id in component?

In an Angular app, I have seen that @Component has property moduleId. What does it mean? And when module.id is not defined anywhere, the app still works. How can it still work? @Component({ moduleId: module.id, selector: 'ng-app', templateUrl: …

Read More