1

我在 Angular v5 应用程序中使用 NGRX v4.1.1（"strictNullChecks": true虽然看起来无关紧要）。

我看到商店出现错误。鉴于以下情况：

showLists: Observable<boolean>;

constructor(private store: Store<State>) {}

ngOnInit() {
  this.showLists = this.store.select('contactsFeature', 'contactsReducer', 'showListsPanel');
}

打字稿在以下方面引发错误this.store.select()：

Type 'Store<boolean>' cannot be converted to type 'Observable<boolean>'.
Property '[Symbol.observable]' is missing in type 'Store<boolean>'.

这种选择存储切片（使用.select）并将其分配给类型变量的方法已在文档Observable<>中正式概述（我实际上看到他们已将文档更新为 ngrx v5 推荐的 API，但 v5 尚未发布然而，所以我已经链接到下一个最新版本的文档）。

问题是它store.select()的返回类型Store<>与Observable<>.

然而，这是与商店交互的“官方”方法（我认为）。所以我想知道出了什么问题。如果我禁用strictNullChecks，我仍然会遇到错误。这个错误出现在一个我一个月后要回来的项目中，我无法确定它究竟是什么时候开始的（或者为什么，很明显）。

任何建议表示赞赏:)

PS：Typescript不会让我将 return.select()转换为 observable。

更新

更新 npm 为我提供了更好的错误消息。看起来 rxjs 的界面已经更新，或者 ngrx 的界面已经更新。

ERROR in apps/coordination/src/app/contacts/contacts-tools.component.ts(21,5): error TS2322: Type 'Store<boolean>' is not assignable to type 'Observable<boolean>'.
  Types of property 'subscribe' are incompatible.
    Type '{ (observer?: NextObserver<boolean> | ErrorObserver<boolean> | CompletionObserver<boolean> | unde...' is not assignable to type '{ (observer: Observer<boolean>): Subscription; (onNext: (value: boolean) => void, onError?: ((err...'.
      Types of parameters 'observer' and 'observer' are incompatible.
        Type 'Observer<boolean>' is not assignable to type 'NextObserver<boolean> | ErrorObserver<boolean> | CompletionObserver<boolean> | undefined'.
          Type 'Observer<boolean>' is not assignable to type 'CompletionObserver<boolean>'.
            Types of property 'complete' are incompatible.
              Type '(() => void) | undefined' is not assignable to type '() => void'.
                Type 'undefined' is not assignable to type '() => void'.
4

2 回答 2

3

我正在使用带有自动模块导入的 vscode。即，如果我使用 npm 模块中的类，vscode 会自动将正确的import语句添加到文件顶部。

显然我的一个 npm 模块（不是 rxjs）定义了它自己的Observable，并且 vscode 已经自动导入了它，非 rxjs 可观察的。这个非 rxjs 的 observable 导致了类型问题。

于 2018-01-04T21:54:55.700 回答
1

我不确定你的减速器是什么样子，但我假设：

contactsFeature -> reducer contactsReducer -> 是 contactsFeature showListsPanel 中的属性 -> 是 contactsReducer 对象中的属性

您可以使用 .select('reducer', 'atribute', 'sub'... ) 而不是采摘 ( .pluck )。

对于其他问题，您可以使用以下方法进行选择：

this.showLists = this.store.select('contactsFeature', 'contactsReducer', 'showListsPanel') as Observable<boolean>;
于 2018-01-04T14:43:08.497 回答