Is it possible to use templates in combination with ng-content like described here:
app component:
<table-column>
<template #template let-item="item">
<input type="text" [(ngModel)]="item.foo" />
</template>
</table-column>
table-column component:
@Component({
selector: 'table-column',
template: '<ng-content></ng-content>'
})
export class TableColumnComponent implements OnInit {
@ViewChild('template') template;
ngOnInit() {
console.log(this.template); // undefined
// create column object with template and different metadata...
});
}
The problem I get undefined using different life cycle hooks (ngOnInit, ngAfterViewInit)...
If you want to search within Light DOM then you need to use @ContentChild and wait until ngAfterContentInit hook
@ContentChild('template') template;
ngAfterContentInit() {
console.log(this.template);
}
See also