Question

通常，一切对我来说都很好，当我运行ng build时，我的代码仍然可以正常工作，并且事件被触发了(activate)。但是，在执行ng build --prod时，此事件不会运行。为什么这会发生在我身上，我该如何纠正？

谢谢

此代码是我的app.ts和.html

<menu class="m-0 p-0" *ngIf="hide"></menu>
<router-outlet class="m-0 p-0" (activate)='onActivate($event)' ></router-outlet>
<footer_component  *ngIf="hide"></footer_component>


onActivate(component:any){
 this.activatedComponent = component.constructor.name;

在使用ng build进行编译之前，在运行ng build之后也可以使用，但是对于ng build --prod no，看来它没有输入函数。

 console.log(activatedComponent);

 if(this.activatedComponent != 'LoginComponent' && this.activatedComponent != 'RestorePasswordComponent'  && this.activatedComponent != 'NotFoundComponent'){
  this.hide = true;
 } else 
 {
  this.hide = false;
 }

}

Answer 1

这很可能是由于生产版本中的缩小过程而发生的。

在您提供的代码中，它正在检查组件的名称，例如 this.activatedComponent != 'LoginComponent'。在生产构建期间，由于缩小，名称可能会被缩小，因此代码不会进入 if 条件，因为它可能会找到缩小的名称。不应依赖可能在部署前的某个时间点缩小的此类。

在这种情况下，一种快速的方法可能是在组件中公开一些公共属性，如 COMPONENT_NAME 并将组件名称分配给该属性，并在您的代码中访问该属性，例如：

onActivate(component:any){
 this.activatedComponent = component.COMPONENT_NAME;

当我运行ng build --prod

1 个答案: