我使用以下代码来创建动态组件
import { Component,OnInit,ViewContainerRef,ViewChild,ViewChildren,ReflectiveInjector,ComponentFactoryResolver,ViewEncapsulation,QueryList,Input,AfterViewInit } from '@angular/core'; import { Router,ActivatedRoute } from '@angular/router'; import { forEach } from '@angular/router/src/utils/collection'; import { IComponent } from 'app/app.icomponent'; @Component({ encapsulation: ViewEncapsulation.None,selector: 'dynamic-component',entryComponents: [HomeComponent,HighlevelSignalComponent],template: ` <div #dynamicDiv [ngClass]="classFromMenu" > <ng-template #dynamicComponentContainer></ng-template> </div> `,styleUrls: [ './dynamic-content.component.css' ],}) export class DynamicComponent implements IComponent,AfterViewInit { classFromMenu: any; @ViewChild('dynamicComponentContainer',{ read: ViewContainerRef }) dynamicComponentContainer: ViewContainerRef; constructor(private resolver: ComponentFactoryResolver,private route: Router,private activatedRoute: ActivatedRoute,) { } ....... buildComponent(passedData) { // orderAndObjs has the data for creating the component this.orderAndObjs.forEach(obj => { var componentFactory = this.resolver.resolveComponentFactory(obj.component); var compRef = this.dynamicComponentContainer.createComponent(componentFactory); // compRef is the component that is created. //Assuming the component that i am trying to create is <dynamic-component>. //I want to add either a class or any other attribute like this //<dynamic-component class="flex"> }); } } }
动态组件创建完美,一切都按预期工作.但唯一的问题是我想为动态组件添加一个类,以便它可以
<dynamic-component class="dynamicClass">
任何帮助表示赞赏:(
解决方法
嗯..我通常将它添加到应该是entryComponent的组件的选择器中…
selector: 'dynamic-component.someclass',^^^^^^^^^^^
添加属性使用属性选择器:
selector: 'dynamic-component[myattr=value]',
我称之为entryComponents的隐藏功能
但它的声明性方法并不能在运行时更改(实际上我们可以更改它)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。