entityMap|0|type|LINK|mutability|MUTABLE|data|url|https://stackoverflow.com/a/49723075/4694994|blocks|key|dfh9f|text|效果转换动作流，因此您有一个动作流作为输入和输出。在您的示例中，您将操作映射到操作数组。操作数组流不是有效的输出类型。您需要扁平化该数组，这意味着您不会将数组本身发送到输出流中，而是将其每个元素发送到输出流中。|unstyled|depth|inlineStyleRanges|entityRanges|fjvro|而不是：|c85te|input:++--a-------a------>
output:+--[b,c]---[b,c]-->|code-block|syntax|javascript|5elcm|您应该执行以下操作：|em55m|input:++--a-------a------>
output:+--b-c-----b-c-->|al9q6|要将数组的可观测值展平为每个元素的可观测值，可以使用以下运算符之一|3q4v9|mergeMap,+switchMap,+exhaustMap。在大多数情况下，|offset|length|style|CODE|bqnnt|mergeMap将是正确的选择。如果您想了解有关这些运算符的更多信息，请查看以下内容answer.|brn3r|@Effect()
register$:+Observable+=+this.actions$.pipe(
++ofType(AuthActionTypes.REGISTER_REQUEST),
++mergeMap((action:+RegisterRequest)+=>+{
++++//+check+for+register+request+success
++++return+[
++++++new+RegisterSuccess(),
++++++new+LoginRequest(action.payload)
++++]
++})
);^0|0|0|0|0|0|0|0|8|A|9|L|A|0|0|8|16|6|0|0^^$0|$1|$2|3|4|5|6|$7|8]]]|9|@$A|B|C|D|2|E|F|15|G|@]|H|@]|6|$]]|$A|I|C|J|2|E|F|16|G|@]|H|@]|6|$]]|$A|K|C|L|2|M|F|17|G|@]|H|@]|6|$N|O]]|$A|P|C|Q|2|E|F|18|G|@]|H|@]|6|$]]|$A|R|C|S|2|M|F|19|G|@]|H|@]|6|$N|O]]|$A|T|C|U|2|E|F|1A|G|@]|H|@]|6|$]]|$A|V|C|W|2|E|F|1B|G|@$X|1C|Y|1D|Z|10]|$X|1E|Y|1F|Z|10]|$X|1G|Y|1H|Z|10]]|H|@]|6|$]]|$A|11|C|12|2|E|F|1I|G|@$X|1J|Y|1K|Z|10]]|H|@$X|1L|Y|1M|A|1N]]|6|$]]|$A|13|C|14|2|M|F|1O|G|@]|H|@]|6|$N|O]]]]

An effect transforms a stream of actions, so you have a stream of actions as input and output. In your example, you map an action to an array of actions. A stream of arrays of actions is not a valid output type. You need to flatten that array, meaning that you do not emit the array itself into the output stream but instead each of its elements. 

Instead of:

<pre><code>input: --a-------a------&gt;
output: --[b,c]---[b,c]--&gt;
</code></pre>

You should do:

<pre><code>input: --a-------a------&gt;
output: --b-c-----b-c--&gt;
</code></pre>

For flattening an Observable of array into Observables of each element, you can use one of the operators <code>mergeMap</code>, <code>switchMap</code>, <code>exhaustMap</code>. In most cases, <code>mergeMap</code> will be the right choice. If you want to learn more about these operators, have a look at this <a href="https://stackoverflow.com/a/49723075/4694994">answer</a>.

<pre><code>@Effect()
register$: Observable&lt;Action&gt; = this.actions$.pipe(
 ofType(AuthActionTypes.REGISTER_REQUEST),
 mergeMap((action: RegisterRequest) =&gt; {
 // check for register request success
 return [
 new RegisterSuccess(),
 new LoginRequest(action.payload)
 ]
 })
);
</code></pre>

entityMap|0|type|LINK|mutability|MUTABLE|data|url|https://ngrx.io/guide/store#diagram|1|https://dev.to/davidshortman/3-radically-small-things-you-can-change-in-your-ngrx-effects-code-that-will-make-me-sleep-better-tonight-21id|2|https://en.wikipedia.org/wiki/Separation_of_concerns|blocks|key|bgn7d|text|我也遇到过同样的情况(假设NgRx+10或更高版本)，我有一个不同的视角，更基本的使用效果的方式。在一个地方顺序地触发多个动作，特别是在一个单一的效果中，是反模式的。在本质上，保持一致是很重要的|unstyled|depth|inlineStyleRanges|entityRanges|b0nhe|general+flow+of+application+state+in+NgRx|offset|length|88q25|行动和潜力的减少。正如NgRx架构所预见的那样。|8h6ad|下面the+3+effect+rules将有助于避免困难的情况：|f85mp|Name+effects作为效果的名称|funag|让你的效果只做一件事仅发出一个操作这样，它可以帮助您遵循设计separation+of+concerns模式，当然，它也可以帮助你的NgRx效果变得更具单元可测试性。|8f2n5|回到你的例子，你可以简单地解耦你想要做的事情(两个额外的动作)与一个代理之间的动作。在你的情况下，你可能甚至不需要你原来的效dispathMultipleActions$|r52i|，除非出现内部的特殊逻辑。(也许，它可能属于状态Reducer，它甚至更具单元可测试性)。|dqjb5|假设ActionTypes.UpdateSomething已经有一个数组负载对象，您可以将您的|9l4c5|dispathMultipleActions$|c5ovh|转换成单个，所以你可以这样做：|9221s|@Effect()
deleteAction$+=+this.actions$.pipe(
++++ofType(ActionTypes.UpdateSomething),
++++concatMap(from(new+Promise((array)+=>+{
++++++++array.forEach(item+=>+{
++++++++++++if+(item+>+3)+{
++++++++++++++++//do+something
++++++++++++}
++++++++});
++++}))),
++++{dispatch:+false}
);

@Effect()
changeAction$+=+this.actions$.pipe(
++++ofType(ActionTypes.UpdateSomething),
++++concatMap(from(new+Promise((array)+=>+{
++++++++array.forEach(item+=>+{
++++++++++++if+(item+<=+3)+{
++++++++++++++++//do+something
++++++++++++}
++++++++});
++++}))),
++++{dispatch:+false}
);|code-block|syntax|javascript^0|0|0|15|0|0|0|2|I|1|0|0|U|M|2|0|0|0|0|0|0^^$0|$1|$2|3|4|5|6|$7|8]]|9|$2|3|4|5|6|$7|A]]|B|$2|3|4|5|6|$7|C]]]|D|@$E|F|G|H|2|I|J|1D|K|@]|L|@]|6|$]]|$E|M|G|N|2|I|J|1E|K|@]|L|@$O|1F|P|1G|E|1H]]|6|$]]|$E|Q|G|R|2|I|J|1I|K|@]|L|@]|6|$]]|$E|S|G|T|2|I|J|1J|K|@]|L|@$O|1K|P|1L|E|1M]]|6|$]]|$E|U|G|V|2|I|J|1N|K|@]|L|@]|6|$]]|$E|W|G|X|2|I|J|1O|K|@]|L|@$O|1P|P|1Q|E|1R]]|6|$]]|$E|Y|G|Z|2|I|J|1S|K|@]|L|@]|6|$]]|$E|10|G|11|2|I|J|1T|K|@]|L|@]|6|$]]|$E|12|G|13|2|I|J|1U|K|@]|L|@]|6|$]]|$E|14|G|15|2|I|J|1V|K|@]|L|@]|6|$]]|$E|16|G|17|2|I|J|1W|K|@]|L|@]|6|$]]|$E|18|G|19|2|1A|J|1X|K|@]|L|@]|6|$1B|1C]]]]

I have had same situation (and assuming NgRx 10 or higher), I have a different perspective, more fundamental way how to use effects. Triggering sequentially multiple actions in one place, specially within a single effect, is anti-pattern.
In essense, its important to keep a consistent <a href="https://ngrx.io/guide/store#diagram" rel="nofollow noreferrer">general flow of application state in NgRx</a> of actions and potentials reductions. Just as the NgRx architecture foresees it.
Following <a href="https://dev.to/davidshortman/3-radically-small-things-you-can-change-in-your-ngrx-effects-code-that-will-make-me-sleep-better-tonight-21id" rel="nofollow noreferrer">the 3 effect rules</a> will help already to avoid difficult situations:
<ol>
<li>Name effects to be the name of the effect</li>
<li>Make your effect only do one thing</li>
<li>Emit only one action</li>
</ol>
That way, it helps you to follow the <a href="https://en.wikipedia.org/wiki/Separation_of_concerns" rel="nofollow noreferrer">separation of concerns</a> design pattern which of course also help you the NgRx effects to become a lot more unit testable.
Back to your example, you can simple decouple what you wanted to do (2 additional actions) with an in-between-proxy action.
In your case it seems that you may not need even your original effect dispathMultipleActions$, unless special logic within appears. (which perhaps, may belong into a state Reducer, which is even more unit testable).
Assuming that the ActionTypes.UpdateSomething has a array payload object already, you could split your dispathMultipleActions$ into single ones, so you could do something like this:
<pre><code>@Effect()
deleteAction$ = this.actions$.pipe(
 ofType(ActionTypes.UpdateSomething),
 concatMap(from(new Promise((array) =&gt; {
 array.forEach(item =&gt; {
 if (item &gt; 3) {
 //do something
 }
 });
 }))),
 {dispatch: false}
);

@Effect()
changeAction$ = this.actions$.pipe(
 ofType(ActionTypes.UpdateSomething),
 concatMap(from(new Promise((array) =&gt; {
 array.forEach(item =&gt; {
 if (item &lt;= 3) {
 //do something
 }
 });
 }))),
 {dispatch: false}
);
</code></pre>

I am using Angular 6, ngrx/store. I have such effect that is responsible for updating things. Depends on some logic I want to dispatch different actions. What is the difference if I use <code>switchMap</code> insted of <code>map</code>?

This is what I tried but it doesn't work:

<pre><code> @Effect()
 dispathMultipleActions$ = this.actions$.pipe(
 ofType(ActionTypes.UpdateSomething),
 map(() =&gt; {
 const actions: Action[] = [];
 const array = [1, 2, 3, 4, 5];
 array.forEach(item =&gt; {
 if (item &gt; 3) {
 actions.push(new DeleteAction(item));
 } else {
 actions.push(new ChangeAction(item));
 }
 });
 return actions;
 })
 );
</code></pre>

How to dispatch multiple actions in ngrx/effect (redux-observable)?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

EdgeOne AI 安全实战专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

 我使用的是Angular 6，ngrx/store。我有这样的效果，负责更新东西。根据一些逻辑，我想分派不同的动作。如果我使用switchMap安装map ? 这就是我尝试过的，但它不起作用： @Effect()  dispathMultipleActions$ = this.actions$.pipe(    of...

问如何在ngrx/effect (redux-observable)中分派多个动作？
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在ngrx/effect (redux-observable)中分派多个动作？EN