我的 webapp 中有几个 div
仅用于调试,我想在生产模式下删除它们。
在我的模板中,我试图做这样的事情:
<div *ngIf=!environment.production>{{ fooState | async | json}}</div>
但是,在运行
ng serve --prod
时失败并出现以下错误:ERROR in src/app/foo/foo.component.html(18,6): : Property 'environment' does not exist on type 'Foo'
有什么方法可以在生产模式下禁用这些,而无需为每个组件添加另一个字段?
我正在使用 Angular cli 1.7.4 和 Angular 5.2.10
最佳答案
如果 environment.production 为 false,您可以创建一个指令以仅显示您的 div 元素。类似于这个 blitzstack 示例:
https://stackblitz.com/edit/angular-eziobx
import { Directive, ViewContainerRef, OnInit, TemplateRef } from '@angular/core';
import { environment } from '../environment';
/**
* usage: <div *hideProd></div>
*/
@Directive({
selector: '[hideProd]'
})
export class HideProdDirective implements OnInit{
constructor(private templateRef: TemplateRef<any>, private viewContainerRef: ViewContainerRef) { }
ngOnInit(): void {
if(!environment.prod){
this.viewContainerRef.createEmbeddedView(this.templateRef);
}
}
}
关于 Angular 模板 : Disable div in production mode,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52612826/