无法访问 redux 存储属性

Question

我无法访问使用 angular 的 redux 存储属性。

我在 IApp 中有两个属性，第一个是接口，第二个是数字。

interface AppStoreInterface {
  layoutInterface: LayoutInterface,
  numero: number
}

我可以毫无问题地访问该号码，但是当我尝试访问 layoutInterface 时却什么都没有发生。

这是模块：

export class AppModule {

  constructor(
    ngRedux: NgRedux<AppStoreInterface>,
    public devTools: DevToolsExtension
  ) {

    const storeEnhancers = devTools.isEnabled() ? [devTools.enhancer()] : [];

    ngRedux.configureStore(
      rootReducer,
      INITIAL_STATE,
      [],
      storeEnhancers
    );
  }
}

这是组件：

export class MainLayoutComponent implements OnInit {

  @select(['layoutInterface', 'sidebarStatus']) sidebarStatus$: boolean;
  @select('numero') test$ :number;

constructor(
    public translate: TranslateService,
    public dialog: MdDialog,
    private ngRedux: NgRedux<AppStoreInterface>,
    private actions: LayoutActions
  ) {
    const browserLang: string = translate.getBrowserLang();
    translate.use(browserLang.match(/en|es/) ? browserLang : 'en');

    this.siteStyle = "app";
    this.boxed = "";
    this.align = "start";
    this.currentLang = "en";
    this.showSettings = false;
    this.showLeftButtton = false;
    this.userLoggedIn = false;

    //this.store = this.getStoreService();
    //this.layoutInterface = this.getLayoutInterface();
  }
}

我做错了什么？

Answer 1

当您使用 @select 时，您不会从商店中获取值，而是获取该值的 Observable。要访问该值，您需要订阅 Observable.

@select(['layoutInterface', 'sidebarStatus']) sidebarStatus$: Observable<boolean>;
                                                              ^^^^^^^^^^^^^^^^^^^^
@select('numero') test$: Observable<number>;
                         ^^^^^^^^^^^^^^^^^^^

您可以使用 async 管道在您的组件模板 (html) 中直接访问它。

<span *ngIf="sidebarStatus$ | async">Sidebar</span>

或者您可以在组件的 class 中明确订阅它，例如将值分配给另一个字段，如 sidebarStatus: boolean;:

ngOnInit() {
  this.sidebarStatus$.subscribe(sidebarStatus => this.sidebarStatus);
}

无法访问 redux 存储属性

Can't access redux store property

redux

angular

angular-redux

无法访问 redux 存储 属性

Can't access redux store property

redux

angular

angular-redux

无法访问 redux 存储属性