使用指令而不是ngIf怎么样，这样你只需要将你的服务注入到指令中，当你在组件中使用时，它也很好用，DRY和最小标记。
就像是
@Directive({
selector: '[showIfLoggedIn]'
})
export class ShowIfLoggedInDirective implements OnInit {
constructor(
private templateRef: TemplateRef,
private viewContainerRef: ViewContainerRef
) { }
ngOnInit() {
var isLoggedIn = false;//TODO use service here and inject into constructor.
if( isLoggedIn ) {
this.viewContainerRef.createEmbeddedView(this.templateRef);
} else {
this.viewContainerRef.clear();
}
}
}然后用
I am logged in
并切换一个班级@Directive({
selector : '[applyClassIfLoggedIn]'
})
export class ApplyClassIfLoggedIn implements OnInit {
@Input('applyClassIfLoggedIn') className;
constructor(
private ele: ElementRef,
private renderer: Renderer2
) { }
ngOnInit() {
var isLoggedIn = true;//TODO use service here.
if( isLoggedIn ) {
this.renderer.addClass(this.ele.nativeElement, this.className);
}
}
}然后
