angular.js - angular2动态创建子组件思路

【字号: 日期:2022-12-27浏览:18作者:雯心

问题描述

总体页面是一个组件模板,有一个子组件已经声明好并在父组件模板中使用,现在我想要动态地在子组件内部创建子组件,我试过这样做:

angular.js - angular2动态创建子组件思路

getViewRef用于动态创建子组件 FileUploadEle虽然可以正确创建,但创建后的元素并不属于PhoneComponent如图:

angular.js - angular2动态创建子组件思路

变成了兄弟元素。该如何做才能正确地创建父子级而不是兄弟级的。

问题解答

回答1:

已经可以了,使用template指令angular.js - angular2动态创建子组件思路

回答2:

没明白你的具体需求,但是我觉得这样做比较好,使用模板声明的方式,而不是在js里创建组件。

注意下面的<ng-content>

import {Component} from ’@angular/core’;@Component({ selector: ’parent’, template: `<p> <h1>parent</h1> <ng-content></ng-content></p> `})export class ParentComponent {}@Component({ selector: ’child’, template: `<h1>child</h1>`})export class ChildComponent {}@Component({ selector: ’demo’, template: `<parent><child></child></

相关文章: