时间戳

首页 > 解决方案 > 与开发模式相比，构建模式下的 Angular NgRx 奇怪行为

angular - 与开发模式相比，构建模式下的 Angular NgRx 奇怪行为

问题描述

我在 Angular 7 项目中使用NgRx lib。
为了根据屏幕显示组件，我使用 store 保存state：启用或禁用。
它在开发模式下完美运行：ng serve但是一旦我使用生成项目，ng build --base-href''我发现了不同的行为：一些不打算显示的组件真的在这里！
有人经历过这种行为吗？找到解决方案了吗？

这是我的代码：

减速器 

export function simpleReducer(state: string = 'activated', action: Action) {

  switch (action.type) {

    case '1':
      return state = 'activated'

    case '0':
      return state = 'disactivated'

    default:
      return state;
  }
}

标题组件：根据屏幕，我使用以下方式显示或不显示帮助按钮：*ngIf="isHelpActivated === 'activated'"

ngOnInit() {
    this.store.select('message').subscribe(value => {
      this.isHelpActivated = value;
    });
  }

Coordiantes 组件：我需要显示帮助按钮的屏幕示例

export class CoordinatesComponent implements OnInit {
...
  constructor(
    private store: Store<HelpState>,
    ...
  ) {}

  ngOnInit() {
    this.store.dispatch({type: '1'});
    ...
  }

  ...
}

帮助状态接口 

interface HelpState {
  message: string;
}

NgRx 的 AppModule 配置

import {StoreModule} from '@ngrx/store';
...

@NgModule({
...
imports: [
...
StoreModule.forRoot({message: simpleReducer}),
...]
})

标签： angularngrxreactivengrx-store

解决方案

推荐阅读