问题描述
我现在需要控制子组件的显示方式,目前已经获取到子组件component的对象实例,但是我怎么把这个对象显示在父组件的模板中呢?
问题出现的环境背景及自己尝试过哪些方法
<ng-template [ngComponentOutlet]="child[0]"></ng-template>这样不得行
相关代码
import { Component, OnInit, ViewContainerRef, TemplateRef, ContentChildren, AfterViewInit } from '@angular/core';
import { ISelectItem } from './item-interface';
@Component({
selector: 'zzj-table-tool-select',
templateUrl: './table-tool-select.component.html',
styleUrls: ['./table-tool-select.component.scss']
})
export class TableToolSelectComponent implements OnInit,AfterViewInit {
children: ISelectItem[] = [];
@ContentChildren('child') child;
constructor() { }
ngOnInit() {
}
public addItem(item: ISelectItem) {
this.children.push(item);
}
ngAfterViewInit() {
console.log('--------');
console.log(this.child)
}
}
语法糖:
直接引用子组件类,不用类实例。
看下官网