Exploring the functionalities of Angular2, I am attempting to have one module (BreadcrumbDemoModule) import the component from another module (BreadcrumbModule).
At the moment, the BreadcrumbModule consists of only one component: ng2-breadcrumb. However, when trying to utilize this component in the BreadcrumbDemoModule, an error message pops up:
'ng2-breadcrumb' is not recognized as an element.
I suspect that I might have missed a line somewhere, and would appreciate it if someone could point out where I may be making a mistake.
Thank you in advance!
Files associated with BreadcrumbModule:
breadcrumb.component.html:
THIS IS A BREADCRUMB TEST
breadcrumb.component.ts:
import { Component } from '@angular/core';
@Component({
selector: 'ng2-breadcrumb',
template: require('./breadcrumb.component.html')
})
export class BreadcrumbComponent {}
components/breadcrumb/index.ts:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BreadcrumbComponent } from './breadcrumb.component';
@NgModule({
imports: [
BrowserModule //for later use
],
declarations: [
BreadcrumbComponent
]
})
export class BreadcrumbModule {}
Files associated with BreadcrumbDemoModule:
breadcrumb-demo.component.html:
<ng2-breadcrumb></ng2-breadcrumb>
breadcrumb-demo.component.ts:
import { Component } from '@angular/core';
import { BreadcrumbModule } from './../index';
@Component({
selector: 'ng2-breadcrumb-demo',
template: require('./breadcrumb-demo.component.html')
})
export class BreadcrumbDemoComponent {}
components/breadcrumb/demo/index.ts:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BreadcrumbModule } from './../index';
import { BreadcrumbDemoComponent } from './breadcrumb-demo.component';
@NgModule({
imports: [
BreadcrumbModule,
BrowserModule,
],
declarations: [
BreadcrumbDemoComponent
]
})
export class BreadcrumbDemoModule {}