草庐IT

Angular Ngrx Store Effect 和 Action 的交互流程

JerryWang_汪子熙 2023-09-28 原文

我们可以使用 Meta Reducer 即高阶 Reducer 的概念。

下面是一个典型的例子：Logger Meta Reducer.

该高阶 Reducer 在真实的归约器执行之前添加一些日志消息：

export function logger(reducer:
    ActionReducer<AppState>): ActionReducer<AppState> {
        return (state: AppState, action: any): AppState => {
            console.log('state', state);
            console.log('action', action);
            return reducer(state, action);
        };
    }

logger 的输入是一个 reducer，返回一个新的与输入的 reducer 具有完全相同的签名的新 reducer，且在这个新的 reducer 里，会首先执行日志记录操作。这有点像 Java 里的面向切片编程技术(AOP).

所示的 logger() 元归约器函数接受 ActionReducer 类型的输入参数（即纯函数或归约器），并且还返回 ActionReducer 类型的函数。 返回的函数在返回包装的减速器之前将状态和操作变量记录到控制台。

回到 App Module 代码，定义一组 ModuleWithProviders 类来包装 StoreDevtoolsModule.instrument() 方法，以便稍后在 App Module 上导入它。

export const storeDevTools:
ModuleWithProviders[] =
    !environment.production ? [StoreDevtoolsModule.instrument()] : [];

最后，将上述的 ModuleWithProviders 导入 App Module：

StoreModule.forRoot((reducers) as any,
        { metaReducers }),

EffectsModule.forRoot(effects),

storeDevTools,

实际上，StoreModule.forRoot() 方法还可以接收第二个参数，类型为 StoreConfig interface：

export declare type StoreConfig<T,
    V extends Action = Action> = {
        initialState?: InitialState<T>;
        reducerFactory?: ActionReducerFactory<T, V>;
        metaReducers?: MetaReducer<T, V>[];

Store Side-Effect

将 Action 分派到 Store 的代码有时会导致一些副作用(Side Effect)。 例如，调度一个动作来将所有Hero 数据加载到应用程序中。 这样的操作会导致必须通过 Angular 服务与托管在服务器端（或云）上的 Web API 进行通信以返回英雄数据的 Side-Effect。 将操作分派到 Store 的代码的这种 Side-Effect，会导致与外部服务的通信。

Ngrx/effects 模块将副作用与容器组件隔离开来，并提供了一个简洁的解决方案来在支持 NgRX Store 的 Angular 应用程序中处理它们。 Ngrx/store 模块向 Store 发送一个操作，以传递从服务器检索到的任何结果或数据。

上图的交互场景概述如下：

  • ngrx/effects 模块监听分发到 Store 的动作。
  • 如果有一个 Effect 被钩住来监听一个分派的动作，这个 Effect 就会运行并执行。
  • 一旦 Effect 从服务器端接收到数据，它就会向 Store 发送一个新的 action，以便 reducer 启动并处理从 Effect 接收到的数据并相应地更新状态。
AngularActionEffectreducersection

有关Angular Ngrx Store Effect 和 Action 的交互流程的更多相关文章

  1. ruby-on-rails - rails : How to make a form post to another controller action - 2

    我知道您通常应该在Rails中使用新建/创建和编辑/更新之间的链接，但我有一个情况需要其他东西。无论如何我可以实现同样的连接吗？我有一个模型表单，我希望它发布数据(类似于新View如何发布到创建操作)。这是我的表格prohibitedthisjobfrombeingsaved: 最佳答案 使用:url选项。=form_for@job,:url=>company_path,:html=>{:method=>:post/:put} 关于ruby-on-rails-rails:Howtomak

  2. ruby-on-rails - 如何在 ruby​​ 交互式 shell 中有多行？ - 2

    这可能是个愚蠢的问题。但是，我是一个新手......你怎么能在交互式ruby​​shell中有多行代码？好像你只能有一条长线。按回车键运行代码。无论如何我可以在不运行代码的情况下跳到下一行吗？再次抱歉，如果这是一个愚蠢的问题。谢谢。 最佳答案 这是一个例子:2.1.2:053>a=1=>12.1.2:054>b=2=>22.1.2:055>a+b=>32.1.2:056>ifa>b#Thecode‘if..."startsthedefinitionoftheconditionalstatement.2.1.2:057?>puts"f

  3. ruby-on-rails - 如何在 Rails Controller Action 上触发 Facebook 像素 - 2

    我有一个ruby​​onrails应用程序。我按照facebook的说明添加了一个像素。但是，要跟踪转化，Facebook要求您将页面置于达到预期结果时出现的转化中。即，如果我想显示客户已注册，我会将您注册后转到的页面作为成功对象进行跟踪。我的问题是，当客户注册时，在我的应用程序中没有登陆页面。该应用程序将用户带回主页。它在主页上显示了一条消息，所以我想看看是否有一种方法可以跟踪来自Controller操作而不是实际页面的转化。我需要计数的Action没有页面，它们是ControllerAction。是否有任何人都知道的关于如何执行此操作的gem、文档或最佳实践？这是进入布局文件的像素

  4. ruby-on-rails - 优雅的 Rails : multiple routes, 相同的 Controller Action - 2

    让多条路线去同一条路的最优雅的方式是什么ControllerAction？我有:get'dashboard',to:'dashboard#index'get'dashboard/pending',to:'dashboard#index'get'dashboard/live',to:'dashboard#index'get'dashboard/sold',to:'dashboard#index'这很丑陋。有什么“更优雅”的建议吗？一个类轮的奖励积分。 最佳答案 为什么不只有一个路由和一个Controller操作，并根据传递给它的参数来

  5. ruby-on-rails - Rails Rspec 测试 Controller 新 Action - 2

    我正在尝试在我的Controller中测试新操作。目前它看起来像这样:Controllerdefnew@business=Business.new@business.addresses.buildend规范describe'GET#new'doit'assignsanewbusinessto@business'doget:newexpect(assigns(:business)).tobe_a_new(Business)endend我想测试“@business.addresses.build”这一行。我该怎么做？提前致谢! 最佳答案

  6. ruby-on-rails - ApplicationController :Class 的未定义方法 `caches_action' - 2

    我正在尝试升级到Rails4beta1，但遇到了一些问题。简而言之，这就是我的应用程序Controller的样子。classApplicationControllercaches_action在Rails4中移到了它自己的gem中，因此包含gem应该可以解决问题。gem"actionpack-action_caching",github:"rails/actionpack-action_caching"但是当我运行我的请求规范或在浏览器中访问该应用程序时，我收到此错误。app/controllers/application_controller.rb:3:in`':undefinedm

  7. ruby-on-rails - Heroku Action 缓存似乎不起作用 - 2

    我一直在Heroku上尝试不同的缓存策略，并添加了他们的memcached附加组件，目的是为我的应用程序添加Action缓存。但是，当我在我当前的应用程序上查看Rails.cache.stats时(安装了memcached并使用dalligem)，在执行应该缓存的操作后，我得到current和total_items为0。在Controller的顶部，我想缓存我有的Action:caches_action:show此外，我修改了我的环境配置(对于在Heroku上运行的配置)config.cache_store=:dalli_store我是否可以查看其他一些统计数据，看看它是否有效或我做错

  8. ruby-on-rails - `method_missing':#<Rails::Application::Configuration:0x00> 的未定义方法 `action_mailer' - 2

    我正在构建一个Rails应用程序并且使用的是Rails4.0.1。我有一个错误，并注意到它在3个月前被称为rails上的一个错误，所以我决定:捆绑更新并获得rails4.0.3这样做之后，测试和服务器都不会启动，并且会抛出错误:gems/railties-4.0.3/lib/rails/railtie/configuration.rb:95:in`method_missing':undefinedmethod`action_mailer'for#(NoMethodError)目前我在config/environments/*中注释掉了action_mailer行，但最好能找到一个真正的

  9. ruby-on-rails - rails 3 缓存 : expire action for named route - 2

    我的Controller有这个:caches_action:render_ticker_for_channel,:expires_in=>30.seconds在我的路由文件中我有这个:match'/render_c_t/:channel_id'=>'render#render_ticker_for_channel',:as=>:render_channel_ticker在日志文件中我看到了这个:Writefragmentviews/mcr3.dev/render_c_t/63(11.6ms)我如何手动使它过期？我需要从与渲染Controller不同的Controller使它过期，但即使

  10. ruby-on-rails - Rails 5 升级 :/actionpack-5. 0.0/lib/action_controller/test_case.rb:49:in `initialize':参数数量错误(0 代表 2)(ArgumentError) - 2

    我最近正在进行Rails5升级，当我尝试启动Rails控制台时遇到了这个错误:/actionpack-5.0.0/lib/action_controller/test_case.rb:49:ininitialize':wrongnumberofarguments(0for2)(ArgumentError)当前bundleupdaterails已经完成了gem依赖项的解决，足以更新到5.0.0，rspec正在运行(尽管我正在修复很多中断)。我也可以运行railss没有错误。这里是代码中断行:https://github.com/rails/rails/blob/master/action

随机推荐