问题标签 [angular-redux]

我有一个集成测试，它依赖于我通过存根提供给测试平台的 2 项服务。

当我updateCategory()在这个类别的订阅块中测试一个函数时，我有一个函数 ngRedux.dispatch({type: something})

错误：TypeError: Cannot read property 'dispatch' of undefined即使服务被存根并提供了功能，也会随机抛出。出于某种奇怪的原因，它认为这是服务的属性。

抛出此错误，无需对测试进行任何更改，只需刷新 karma 页面：

• 每次随机测试。
• 有时所有测试都通过，但仅在控制台中出现错误。
• 有时它会在抛出错误后停止尝试其他测试。
• 有时它会在所有测试都通过时抛出错误。

它是如此不可预测，它对我来说根本没有意义。

测试床配置：

测试配置：

如果没有上面的测试——错误不会被抛出。如果没有该订阅块中的调度函数，也不会抛出错误。

我写了这个，@angular-redux/store想知道是否已经存在解决方案。

https://github.com/angular-redux/store/issues/551

这是一个回顾，可以让您免于阅读链接：

到目前为止，使用 Angular 和 Storybook 效果很好。但是，在某些情况下，我的组件依赖于 @select()。如何让我的故事中的组件使用模拟的可观察对象或数据点？

这是我的示例代码：

我的组件有：

我们正在开发一个发布到私人仓库的角度库。我们运行一个本地 Web 应用程序来测试开发中的库。我们也发布图书馆。

当我使用 构建应用程序ng build时，结果dist版本无法运行。

我的文件结构是：

我的 CI 构建过程是：

我最终得到一个dist目录：

里面的index.html文件./dist/test是

为了确保这有效，我正在运行http-server以测试我的应用程序：

这是我的问题。应用程序询问我是否忘记配置商店？我不明白，因为这只发生在我运行dist应用程序版本时。

这是错误：

这肯定是@angular-redux/store导致这个问题的原因。我删除了目录dist/my-library，我得到了同样的错误。Angular 能够使用本地库构建应用程序，但是本地库在 Redux 存储（即@angular-redux/store.

我在我当前的项目中使用 angular-redux 已经有一段时间了，最​​近我注意到非常奇怪的行为，在我看来，State 正在发生变异！然后我安装了 redux-freeze 并得到了很多object is not extensible错误。

现在，有问题的流程如下所示：

我有一个容器

获取一片数据，然后我将数据传递给这样的子组件

在子组件中，我可以更改对象的某些字段并将data对象发送回容器，然后容器将数据发送到服务器。

什么是做基本相同但又防止object is not extensible错误发生的正确方法？

我正在使用 angular 7 的 redux。我可以将值添加到状态。但是我怎样才能订阅状态的变化值。

这是我尝试过的代码

选择器

运动组件

这是我的减速器组件

状态图

控制台输出

参考

在 Angular (v5) 中，我如何监听我的应用程序 Redux 状态对象的变化？

https://github.com/angular-redux/store/blob/master/articles/select-pattern.md

使用最新版本的@ngrx-redux/store。我可以通过字符串选择状态的任何部分。当我尝试访问属性时，它返回“未定义”错误。

句法：

使用

this.loadedClients = this.store.select('superUser')

可以，但是使用异步管道获取loadedClients 属性会导致标记混乱。

我在 Google 或文档中找不到示例。

我已经接管了一个现有的 Angular 应用程序，我正在从 5 更新到版本 7。对于状态管理，它使用已更新到版本 9.0 的@angular-redux。但是，保持商店不变会导致应用程序无法加载（没有控制台错误）。

我已经更改了每个史诗中的功能，如终端中所说的代码所示。但是，我还没有找到有关如何调整项目正在运行的主 store.ts 文件的资源，这会破坏应用程序。如果有人知道要在该文件中放入什么以使商店正确设置，请分享。

商店.ts：

以下是特定的 epic.ts 文件之一的示例：

我有现有代码，我在 AppModule 构造函数中配置了商店：

这几乎就是文档告诉如何使用它的方式。

现在我正在尝试在我的商店中使用redux-state-sync 。但是 redux-state-sync 文档的示例指示我使用 createStore 而不是 configureStore：

如果我尝试将中间件添加到 configureStore：

我得到错误：

src/app/app.module.ts(51,56) 中的错误：错误 TS2345：类型参数 'StoreEnhancer<{ dispatch: {}; }, {}>' 不可分配给类型为“Middleware<{}, any, Dispatch>[]”的参数。类型 'StoreEnhancer<{ dispatch: {}; }, {}>' 缺少来自类型 'Middleware<{}, any, Dispatch>[]' 的以下属性：pop、push、concat、join 等 25 个。

如何将 redux-state-sync 与 angular-redux 一起使用？

谢谢！

编辑：

我可以这样做：

但似乎状态更改未同步到其他选项卡。

编辑 - 如果我将 redux-state-sync 配置为使用 localstorage，这一切都有效。我创建了一个包含工作代码示例的存储库https://bitbucket.org/em-aitch/sync-app/src/master/ 。如果广播频道类型（app.component.ts：76）从“localstorage”更改为“native”，则绑定（@select 和 {{ property }} 都不再起作用了！

EDIT2 - 问题如何找出破坏 Angular 绑定的原因？回答这个问题

我已经使用下面描述的 redux-state-sync进行了设置 。redux 状态更改已同步到其他浏览器窗口，但 @select 不起作用。

当我在一个窗口中登录时，app-nav-menu 会出现，因为 ngIf 评估为 true。两个订阅也都写入控制台：

然而，即使在另一个窗口中完成的登录状态更改在那里同步，其他浏览器窗口也不会以相同的方式工作。控制台输出是一样的：

然而，问题是 app-nav-menu 没有出现。下面首先是与此直接相关的代码，最后是 redux 定义。

app.component.html

app.component.ts

app.module.ts

存储/索引.ts

就像我在顶部的编辑中所说的那样。如果我将其配置为使用本地存储，则此方法有效：

当用户单击它时如何在新选项卡中打开垫子菜单项，我尝试了下面提到的所有可能方法，能够在新选项卡中打开，但当前选项卡完全空白，直到新选项卡获取数据。