Angular 如何使用NgRx和不同的延迟加载角度模块为现实世界的应用程序建模

我是Angular/NgRx新手，在理解NgRx功能和Angular模块之间的关系时遇到困难。我有一个特定的用例，但我认为这个问题可以帮助其他人在建模真实世界的应用程序场景时遵循一些最佳实践

我想对以下内容进行建模：

我的数据库中有一组框，每个框可以包含N个项，这些项以类似于图形的方式相互连接。每个项目仅连接到其框内的项目。 用户可以通过以下3条路线与箱子交互：

/box

=>显示用户拥有的所有框，用户可以添加或删除框

/boxes/：id

=>显示一个特定的框及其内部内容。用户只能看到框内项目的图形

/boxes/：id/edit

=>授权用户可以编辑框的内容，添加、删除、编辑项目及其之间的连接（以便编辑项目的图表）。他们还可以删除长方体并更新某些长方体属性（重量、大小等）

我想在两个延迟加载的角度模块中分离这些路由，一个是框列表（1），另一个是单框操作（2，3），因为图形编辑模式非常繁重，我不想在用户导航到框列表页面时加载所有图形组件和动画

问题:

• 考虑到一个盒子上的某些操作在（1）和（2,3）中都是可执行的，我应该如何在我的应用程序中建模ngrx存储？例如：我可以从框列表和框详细信息中更新框（在列表中，我可以创建一个新框，给它一个名称，在/编辑页面中，我可以更改它的名称）。箱子状态应存储在哪个模块中？如果我将其存储在列表页面中，当我从编辑页面更改属性时，我应该更新另一个模块中的存储（这是否可能/正确？）。如果我将其存储在详细信息页面中，那么在显示列表时如何显示框属性
• 如果我想在两个不同的延迟加载模块中分离（2）和（3），因为当用户只想查看一个框时，我看到编辑部分太重而无法加载，该怎么办？我是否应该复制我的存储，并在两个模块中使用相同的状态和还原器，但操作不同？我应该和你一起去商店吗？怎么用？我的组件呢？当然，有很多组件只需要在这两个模块之间共享。我是否应该创建一个共享模块，而不是Angular文档建议的“主”共享模块