ng-template和ng-container的嵌套使用

    科技2024-10-21  17

    源代码:

    <h4>Jerry: {{position}}</h4> <div *ngIf="components[0]"> <h5>Component uid: {{ components[0].uid }}</h5> <h6>Type code: {{ components[0].typeCode }}</h6> </div> <h4>end</h4> <ng-template [cxOutlet]="position" [cxOutletContext]="{ components$: components$ }" > <div>before ng-template</div> <ng-template *ngFor="let component of components" [cxOutlet]="component.flexType" [cxOutletContext]="{ component: component }" [cxOutletDefer]="getComponentDeferOptions(component.flexType)" (loaded)="isLoaded($event)" > <div>before ng-container,type: {{ component.flexType}}</div> <ng-container [cxComponentWrapper]="component"></ng-container> <div>after ng-container</div> </ng-template> <div>after ng-template</div> </ng-template>

    汪子熙 认证博客专家 前端框架 Node.js SAP JerryWang,2007年从电子科技大学计算机专业硕士毕业后加入SAP成都研究院工作至今。Jerry是SAP社区导师,SAP中国技术大使。2020年5月下旬,Jerry做了脑部肿瘤的开颅切除手术,对编程和人生又有了新的感悟。
    Processed: 0.034, SQL: 8