I'm trying to create my own directive in Angular 4. But, I got this error when bind the property of class into component template.
Console error:
Unhandled Promise rejection: Template parse errors: Can't bind to
'data' since it isn't a known property of 'tree'. ("<tree [ERROR
->][data]="data"></tree>"):
My tree-view-component.ts:
@Component({
selector: 'app-tree-view',
template: '<tree [data]="data"></tree>'
})
export class TreeViewComponent implements OnInit {
@Input() data: any[];
constructor() {
this.data = [
{
label: 'a1',
subs: [
{
label: 'a11',
subs: [
{
label: 'a111',
subs: [
{
label: 'a1111'
},
{
label: 'a1112'
}
]
},
{
label: 'a112'
}
]
},
{
label: 'a12',
}
]
}
];
}
ngOnInit() { }
}
Here is my complete script file: https://pastebin.com/hDyX2Kjj
Is there anyone know about this? TiA
Every component, directive, and pipe needs to be registered in @NgModule()
@NgModule({
declarations: [TreeViewComponent]
})
export class AppModule {}
For more details see