Angular2*ngIf带子指令
我似乎无法让我的指令发挥作用,不知道这是否是由于使用了*ngif 组件HTML:Angular2*ngIf带子指令,angular,directive,angular-ng-if,Angular,Directive,Angular Ng If,我似乎无法让我的指令发挥作用,不知道这是否是由于使用了*ngif 组件HTML: <div *ngIf="ticket" class="row"> <div class="col-xs-12"> <h4 appUsername>{{ticket.raisedBy.firstName}} {{ticket.raisedBy.surname}}</h4> </div> </div> 组件HTML中需要*
<div *ngIf="ticket" class="row">
<div class="col-xs-12">
<h4 appUsername>{{ticket.raisedBy.firstName}} {{ticket.raisedBy.surname}}</h4>
</div>
</div>
组件HTML中需要*ngIf,因为我正在从ngOnInit上的JSON服务收集数据
为简洁起见忽略代码:我正在将指令添加到导出指令的“共享”模块中。然后将此模块导入到主应用程序模块中
这是一个已知的问题还是我的代码
更新我现在可以工作了,但是我必须将指令导入到包含组件的模块中。我不能将其导入AppModule,然后全局使用吗?角度
模块系统的工作原理如下:
- 您需要
声明组件
/指令
/。。。只需一个NgModule
然后,您可以在属于此NgModule
的组件中使用它李>
- 要使用
组件
/指令
/。。。在任何其他NgModule
中,您需要从声明的NgModule
中导出它,并导入您想要使用它的NgModule
中声明的NgModule
在您的案例中,您在SharedModule
中声明并导出指令
,在AppModule
中导入SharedModule
,但您在另一个NgModule
中使用指令
,它不导入
共享模块
,也不导入
应用模块
,因此不知道您的指令
因此,要在NgModule
中使用某个东西,它需要声明它,导入
声明的NgModule
或导入
aNgModule
,这导入
是声明的NgModule
仅当声明的NgModule
导出指令时,导入才起作用
什么不起作用?预期的行为是什么?您是否尝试将红色
代码移动到ngAfterViewInit()
?@GünterZöchbauer该指令未更改组件HTML中h4中文本的颜色。您是否将共享模块导入到包含上述组件的模块?@GünterZöchbauer导入所有工作,并且应用程序的控制台中没有编码错误。如果未执行构造函数,则模块配置几乎100%存在问题。如果选择器匹配,则不会有太多其他原因导致它。
import { Directive, ElementRef, Input } from '@angular/core';
@Directive({
selector: '[appUsername]'
})
export class UsernameDirective {constructor(el: ElementRef) {
console.log('App Username directive init');
el.nativeElement.style.color = 'red';
}
}