首页 > 代码库 > [Angular 2] Generate and Render Angular 2 Template Elements in a Component
[Angular 2] Generate and Render Angular 2 Template Elements in a Component
Angular 2 Components have templates, but you can also create templates inside of your templates using Angular 2 ViewContainer’s createEmbeddedView for more visual control of how you want to generate elements inside of your Angular 2 templates.
import {Component, ViewChild, ViewContainerRef, ComponentFactoryResolver, ViewChild} from ‘@angular/core‘;import {SimpleService} from "../../serivces/simple.service";import {WidgetThree} from "../widgets/widget-three.component";@Component({ moduleId: module.id, selector: ‘home‘, templateUrl: ‘home.component.html‘})export class HomeComponent { @ViewChild(‘container‘, { read: ViewContainerRef }) container; @ViewChild(‘template‘) template; constructor(private resolver: ComponentFactoryResolver, private simpleService: SimpleService) { } ngAfterContentInit(){ const WidgetFactory = this.resolver.resolveComponentFactory(WidgetThree); this.container.createComponent(WidgetFactory); this.container.createComponent(WidgetFactory); this.container.createComponent(WidgetFactory); this.container.createComponent(WidgetFactory); this.container.createComponent(WidgetFactory); } onClick(){ this.container.createEmbeddedView( this.template ) }}
<template #template> <h3>tempalte title</h3> <section>tempalte section</section> <footer>template footer</footer></template>
[Angular 2] Generate and Render Angular 2 Template Elements in a Component
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。