Ngrx отправляет одно действие несколько раз за раз

В моем приложении есть 3 кнопки загрузки. При каждом нажатии кнопки будет отправляться DownloadFileAction (payload = fileId). Эффект будет продолжать прослушивать тип Download_File_Action.

@effect()
download_attachment$: Observable = this.actions$
.ofType(FileActions.ActionTypes.DOWNLOAD_ATTACHMENT)
.map(toPayload)
.switchMap( attachment => {
return this.service.downloadAttachment(attachment.link) //absolute link
.map( (data) => {
this.service.saveAttachment(data); //save file locally
return new FileActions.DownloadAttachmentSuccessAction(attachment);
})
.catch(error => {
//debugger;
console.log(error);
});

})

Если одновременно нажать более 1 кнопки, будут отправлены 2 действия DownloadFileAction.

Howerver, download_attachment $ effect прослушивает только тот, который загружается первым, а затем возвращает DownloadAttachmentSuccessAction, поэтому загрузка других файлов не будет завершена.

Есть ли какое-нибудь решение или обходной путь? Ваша идея очень ценится


redux angular ngrx ngrx-effects ngrx-store
person Huy Nguyen    schedule 12.05.2017    source источник
comment
Замените switchMap на mergeMap.   -  person cartant    schedule 12.05.2017
comment
Спасибо @cartant, mergeMap отлично работает   -  person Huy Nguyen    schedule 13.05.2017

Ответы (1)


arrow_upward
11
arrow_downward

Как @cartant упомянул в комментарии, замените switchMap на mergeMap.

Разница в том, что switchMap будет переключать контексты каждый раз, когда срабатывает родительский наблюдаемый объект, а mergeMap будет продолжать слушать родительский наблюдаемый объект и объединить или объединить результаты.

SwitchMap

По сути, switchMap отписывается от первого потока родительского наблюдаемого объекта, когда родительский наблюдаемый объект испускает новое значение.

введите описание изображения здесь

На мраморной диаграмме вы можете видеть, когда отправляется 3, а затем отправляется 5, окончательный вывод не включает 3 30, потому что, когда был отправлен 5, он переключал контексты, и значения отбрасывались.

MergeMap

MergeMap объединит все значения, полученные от родительского наблюдаемого.

введите описание изображения здесь

На мраморной диаграмме для mergeMap вы можете видеть, что все значения испускаются для каждого значения, испускаемого родительским наблюдаемым. то есть все 30s испускаются, даже если последнее значение приходит после того, как 5 испускается от родителя.

Надеюсь, это поможет немного лучше проиллюстрировать это.

person Tyler Jennings    schedule 12.05.2017
comment
Спасибо @TylerJenning за ваш ответ и четкое объяснение. - person Huy Nguyen; 13.05.2017