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>

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

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

无法访问redux商店属性

1 个答案: