CODEWITHSUNDEEP
angularangular2-routing
Amanda K
Amanda K

Reputation: 75

Angular 2 can no longer import components into other components with modules

I redid my architecture recently and created modules for every component so I could lazy load them when routing. This works great. However, I'm having issues simply importing components into other components now and not entirely sure why. I'm importing like this:

import {TrackingComponent} from './tracking/tracking.component';

and my selector is simply:

<tracking></tracking>

when I run this I get:

error_handler.js:46 EXCEPTION: Uncaught (in promise): Error: Template parse errors: 'tracking' is not a known element:

Any idea what I'm doing wrong? The module/component distinction is a little muddy in mind at the moment. Thanks.

Upvotes: 1

Views: 139

Answers (1)

Paul Samsotha
Paul Samsotha

Reputation: 208944

You don't need to import components classes into other classes. That does absolutely nothing (in the context of Angular) but let you use the that class in another file.

What you need to do is @NgModule.imports the whatever module the components is in, into the other module of the component in which you are trying to use the other component

@Component({
  selector: 'other'
})
class OtherComponent {}

@NgModule({
  declarations: [ OtherComponent ],
  exports: [ OtherComponent ]
})
class OtherModule {}

@Component({
  selector: 'consumer',
  template: '<other></other>'
})
class ConsumerComponent {}

@NgModule({
  imports: [ OtherModule ],
  declarations: [ CosumerComponent ],
  exports: [ ConsumerComponent ]
})
class ConsumerModule {}

Upvotes: 3

Related Questions