我正在使用一个库,希望我指定一个指令的主体作为模板元素的子元素
- <template customDirective>
- <custom-element #lookup></custom-element>
- </template>
有没有办法在我的组件中访问自定义元素#lookup.
例如,
- @Component({
- selector: 'app-test',template: `
- <template customDirective>
- <custom-element #lookup></custom-element>
- </template>
- `
- })
- export class TestComponent {
- @ViewChild('lookup') viewChildRef;
- @ContentChild('lookup') contentChildRef;
- constructor() {
- }
- ngAfterContentInit(): void {
- console.log(this.viewChildRef); // <-- undefined
- console.log(this.contentChildRef); // <-- undefined
- }
- }
在这两种情况下我都没有定义.
在不创建嵌入视图之前,无法获取模板内部组件的引用.
尝试使用setter,如:
- @ViewChild('lookup')
- set lookUp(ref: any) {
- console.log(ref);
- }