Angular ngrx effects多次调用http
我正在使用最新版本的ngrx(4.1.1)和angular 4.4.4,在这里找不到问题,可能需要一些帮助 我使用的效果调用this.apiProvider.getLogisticsFolder()并处理http响应。当我的reducer返回新状态并且一切正常时,我的rest服务将被第二次甚至多次调用(操作/效果只触发一次,rest调用getLogisticsFolder()也是如此) 我错过了什么Angular ngrx effects多次调用http,angular,rest,ionic-framework,redux,ngrx,Angular,Rest,Ionic Framework,Redux,Ngrx,我正在使用最新版本的ngrx(4.1.1)和angular 4.4.4,在这里找不到问题,可能需要一些帮助 我使用的效果调用this.apiProvider.getLogisticsFolder()并处理http响应。当我的reducer返回新状态并且一切正常时,我的rest服务将被第二次甚至多次调用(操作/效果只触发一次,rest调用getLogisticsFolder()也是如此) 我错过了什么 @Effect() syncFolders$ = this.actions$ .ofTy
@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)
})
);
@Effect()
syncFolders$=this.actions$
.of类型(LogisticsFolderActions.SYNC_文件夹)
.mergeMap(()=>this.apiProvider.getLogisticsFolder()
.withLatestFrom(this.\u store.select(state=>state.logisticsFolders),this.\u store.select(state=>state.settings))
.map(([cloudLogisticsFolder,localLogisticsFolderState,settingsState])=>
{
让tempLocalLogisticsFolder=localLogisticsFolderState.find(localLogisticsFolderState=>localLogisticsFolderState.tenant==settingsState.baseURL);
if(tempLocalLogisticsFolder)
{
//现在检查文件夹结构是否已添加、删除或更改
让updatedFolders=this.logisticsFolderProvider.checkAndProceedLogisticsFolderUpdate(cloudLogisticsFolder、tempLocalLogisticsFolder.logisticsFolders)
this.logisticsFolderProvider.checkAndProceedTasksUpdate(cloudLogisticsFolder,updatedFolders)
返回新的LogisticsFolderActions.SyncSuccess;
}否则
{
让logisticsFolderState={};
logisticsFolderState.tenant=settingsState.baseURL;
logisticsFolderState.logisticsFolders=cloudLogisticsFolder;
返回新的LogisticsFolderActions.SyncSuccess({logisticsFolder:logisticsFolderState});
}
})
.catch((错误)=>
{
this._store.dispatch(新AppActions.UnexpectedError(error.json().message));
返回可观察的.of(新LogisticsFolderActions.SyncFailed)
})
);
感谢您的帮助:)修复了
我订阅了分配给这个.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);
}
私有oAuthRequest(选项):可观察
{
返回此.token$.flatMap(token=>
{
options.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);
}
返回此文件。http
.请求(新请求(选项))
.map((res:Response)=>
{
如果(res.text)
{
返回res.json();
}
返回res
});
}).采取(1)项措施;
}