ngrx effects 多次调用 http答案

【问题标题】：ngrx effects calls http several timesngrx effects 多次调用 http
【发布时间】：2017-12-08 07:54:24
【问题描述】：

我正在使用最新版本的 ngrx (4.1.1) 和 angular 4.4.4，在这里找不到问题，可能需要一些帮助。

我正在使用调用 this.apiProvider.getLogisticsFolder() 并与 http 响应一起使用的效果。一旦我的减速器返回新状态并且一切都按预期工作，我的休息服务就会被第二次甚至多次调用（动作/效果只触发一次，其余的调用 getLogisticsFolder() 也是如此）。

我在这里错过了什么？

@Effect()
syncFolders$ = this.actions$
    .ofType<LogisticsFolderActions.SyncFolders>(LogisticsFolderActions.SYNC_FOLDERS)
    .mergeMap(() => this.apiProvider.getLogisticsFolder()
        .withLatestFrom(this._store.select(state => state.logisticsFolders), this._store.select(state => state.settings))
        .map(([cloudLogisticsFolder, localLogisticsFolderState, settingsState]) =>
        {
            let tempLocalLogisticsFolder = localLogisticsFolderState.find(localLogisticsFolderState => localLogisticsFolderState.tenant === settingsState.baseURL);
            if (tempLocalLogisticsFolder)
            {
                //now check if the folder structure has been added, deleted or changed
                let updatedFolders = this.logisticsFolderProvider.checkAndProceedLogisticsFolderUpdate(cloudLogisticsFolder, tempLocalLogisticsFolder.logisticsFolders)
                this.logisticsFolderProvider.checkAndProceedTasksUpdate(cloudLogisticsFolder, updatedFolders)

                return new LogisticsFolderActions.SyncSuccess;
            } else
            {
                let logisticsFolderState = <LogisticsFolder.State>{};
                logisticsFolderState.tenant = settingsState.baseURL;
                logisticsFolderState.logisticsFolders = cloudLogisticsFolder;
                return new LogisticsFolderActions.SyncSuccess({ logisticsFolder: logisticsFolderState });
            }
        })
        .catch((error) =>
        {
            this._store.dispatch(new AppActions.UnexpectedError(error.json().message));
            return Observable.of(new LogisticsFolderActions.SyncFailed)
        })
    );

感谢您的帮助:)

【问题讨论】：

标签： angular rest ionic-framework redux ngrx

【解决方案1】：

固定...

我订阅了分配给 this.token$ 的令牌，随着状态的更新，执行了一个新值，因此我们收到了几个请求。

private oAuthRequest(options): Observable<any>
    {
        return this.token$.flatMap(token =>
        {
            options.headers = new Headers();
            options.headers.append('Content-Type', 'application/json');
            options.headers.append('Authorization', token);

            if (options.body && typeof options.body !== 'string')
            {
                options.body = JSON.stringify(options.body);
            }

            return this.http
                .request(new Request(options))
                .map((res: Response) =>
                {
                    if (res.text)
                    {
                        return res.json();
                    }
                    return res
                });
        }).take(1);

    }

【讨论】：