angular - Visual Studio 无法识别 NgRx ofType() 返回类型（显示从不输入，仍可在浏览器中编译和运行）

Question

我有以下使用 NgRx 的代码Effect：

import { Injectable } from "@angular/core";
import { Actions, ofType, Effect } from "@ngrx/effects";
import { SearchContactService } from "../../search-contact.service";
import { Action } from "@ngrx/store";
import { Observable, of } from "rxjs";
import { SearchActionTypes, SearchTagResultAction, SearchKeywordResultAction } from "../actions/search.action";
import { mergeMap, map, debounceTime, distinctUntilChanged, filter } from "rxjs/operators";

@Injectable()
export class SearchEffects {

    @Effect()
    enterSearch$: Observable<Action> = this.actions$.pipe(
        ofType(SearchActionTypes.SearchEnterKeyword),
        filter(action => { return action && action.payload.keyword && action.payload.keyword.length }),
        debounceTime(300),
        distinctUntilChanged(),
        mergeMap(action => {
            let keyword = action.payload.keyword as string;

            if (keyword.startsWith("#")) {
                return this.searchContactService.searchTag(keyword.substr(1))
                    .pipe(
                        map(data => new SearchTagResultAction({
                            tags: data,
                        }))
                    );
            } else {
                return this.searchContactService.searchContact(keyword)
                    .pipe(
                        map(data => new SearchKeywordResultAction({
                            contacts: data,
                        }))
                    );
            }
        }),
    );

    constructor(
        private searchContactService: SearchContactService,
        private actions$: Actions) {

    }

}

该代码在浏览器中编译并运行良好。action但是，VS 在每个参数上都显示错误，这很烦人。

有人有这个问题吗？我该如何解决？

编辑：我发现这是因为ofType方法，而不是pipe本身。仍然无法理解为什么。

编辑 2：为ofType另一个分配错误添加类型后。在浏览器中，它仍然可以编译和运行。我什至尝试过SearchActions（我的联合动作类型），仍然存在同样的问题。

编辑：找到解决方案：在 mergeMap 上也使用显式类型：

mergeMap<SearchEnterKeywordAction, SearchActions>(action => {

Answer 1

您必须键入ofType运算符：

ofType<SearchEnterKeyword>(SearchActionTypes.SearchEnterKeyword),

从 NgRx 7 开始，您还可以键入Actions注入的@ngrx/effects

constructor(private actions$: Actions<MyActionsUnion>) {}