Question

我在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');
}

Typescript在this.store.select()上引发错误：

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

这种选择商店切片（使用.select）并将其分配给Observable<>类型的变量的方法是officially outlined in the documentation（我实际看到他们已将文档更新为ngrx v5推荐的API，但v5尚未发布，所以我已链接到下一个最新版本的文档。）

问题是store.select()的返回类型为Store<>，与Observable<>不兼容。

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

任何建议都表示赞赏：）

PS：Typescript将不让我将.select()的回复转换为可观察的。

更新

更新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'.

Answer 1

我不确定你的减速器是怎么样的，但我认为：

contactsFeature - ＆gt;减速器 contactsReducer - ＆gt;是contactsFeature中的属性 showListsPanel - ＆gt;是contactsReducer对象中的属性

您可以使用.select（'reducer'，'atribute'，'sub'...）而不是采摘（.pluck）。

对于其他问题，您可以使用以下选项转换选择：

this.showLists = this.store.select('contactsFeature', 'contactsReducer', 'showListsPanel') as Observable<boolean>;

Answer 2

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

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

Ngrx：Property'[Symbol.observable]'在类型'Store <boolean>'错误中缺失

更新

2 个答案: