是否有一种类型安全的方式来访问ngrx / store中的商店成员?

时间:2017-05-16 20:31:34

标签: angular typescript ngrx ngrx-store

我使用angular2

浏览了ngrx / store的文档

https://github.com/ngrx/store

https://github.com/ngrx/example-app

上面的示例应用程序意味着我应该使用以下方式访问商店的可观察成员:

counter: Observable<number>;
constructor(private store: Store<AppState>){
    this.counter = store.select('counter');
}

使用'counter'字符串访问对象成员感觉与TypeScript相对立。是否有一种类型安全的方式来访问商店会员?

1 个答案:

答案 0 :(得分:3)

如果你看一下select的实现:

export function select<T, R>(pathOrMapFn: any, ...paths: string[]): Observable<R> {
  let mapped$: Observable<R>;
  if (typeof pathOrMapFn === 'string') {
    mapped$ = pluck.call(this, pathOrMapFn, ...paths);
  }
  else if (typeof pathOrMapFn === 'function') {
    mapped$ = map.call(this, pathOrMapFn);
  }
  else {
    throw new TypeError(`Unexpected type ${ typeof pathOrMapFn } in select operator,`
      + ` expected 'string' or 'function'`);
  }
  return distinctUntilChanged.call(mapped$);
}

您将看到传递字符串等同于pluck,但传递选择器函数等同于map - 这是类型安全的。

所以传递选择器功能。这就是example app中的内容。

使用您的示例:

counter: Observable<number>;
constructor(private store: Store<AppState>){
  this.counter = store.select(state => state.counter);
}