Angular 2:向动态创建的组件添加指令
发布时间:2020-12-17 18:11:14 所属栏目:安全 来源:网络整理
导读:我遇到了以下 Plunker来动态添加和删除组件. 根据以上链接和许多其他SO帖子,我知道如何访问输入和输出属性: this.compRef.instance.someProperty = 'someValue';this.compRef.instance.someOutput.subscribe(val = doSomething()); 而且我还有一个指令“app
我遇到了以下
Plunker来动态添加和删除组件.
根据以上链接和许多其他SO帖子,我知道如何访问输入和输出属性: this.compRef.instance.someProperty = 'someValue'; this.compRef.instance.someOutput.subscribe(val => doSomething()); 而且我还有一个指令“appFont”. import { Directive,ElementRef } from '@angular/core'; @Directive({ selector: '[appFont]' }) export class HighlightDirective { constructor(el: ElementRef) { el.nativeElement.style.font = 'Calibri'; } } 如何将这个“appFont”指令添加到新动态创建的组件中? 解决方法
这可能应该做的工作.你可以从@Input()中获取一些HTML元素,或者只是通过getElement(s)来定位元素.然后你将属性添加到组件中.
@Component({ selector: 'my-app',template: `<h1 id="header">{{title}}</h1>` }) class AppComponent implements OnInit{ @Input() el: ElementRef // or HTMLElement; title="hello world angular"; ngOnInit() { el.nativeElement.createAttribute("appFont"); // or document.getElementById("header").createAttribute("appFont") } } (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |