如何在 angular 组件中使用 NGXS Select()

Question

我有一个 angular 项目，其中包含我刚刚设置的 NGXS。

在我的 AuthState 中，我有以下内容：

@Injectable()
export class AuthState {
  @Selector()
  static isAuthenticated(state: AuthStateModel) {
    return state.currentUser !== null;
  }
  //...
}

在组件中，我正在执行以下操作：

export class HeaderComponent implements OnInit {
  @Select(AuthState.isAuthenticated) isAuthenticated$: Observable<boolean>;
  //...
}

但是它给我一个编译错误：

src/app/layout/header/header.component.ts:14:38 - error TS2564: Property 'isAuthenticated$' has no initializer and is not definitely assigned in the constructor.

14   @Select(AuthState.isAuthenticated) isAuthenticated$: Observable<boolean>;
                                        ~~~~~~~~~~~~~~~~

我完全理解为什么在这里，angular无法知道它是否会被正确初始化。

我搜索了一下，发现很多 link 指向禁用属性初始化检查

"strictPropertyInitialization": false

在 tsconfig.

但问题是我喜欢这个检查，我不想禁用它。必须有一种方法可以在整个应用程序中不禁用它，但仍然使用 NGXS Select，对吗？

Answer 1

因为您不想更改设置。那么你必须通过构造函数来设置它。

constructor(store: Store){
    this.isAuthenticated$= store.select(AuthState.isAuthenticated);
}

如何在 angular 组件中使用 NGXS Select()

How to use NGXS Select() in an angular component

angular

typescript

ngxs