Javascript ngrx处理对象中的嵌套数组

我正在学习redux模式，并将ngrx与angular 2一起使用。我正在创建一个示例博客网站，它具有以下形状

导出接口博客内容{
id：字符串；
标题：字符串；
标签：字符串[]；
标题：字符串；
实际内容：实际内容[]；
}

而不是嵌套结构

export interface BlogContent {
  id: string;
  header: string;
  tags: string[];
  title: string;
  actualContent: ActualContent[]; <------ NESTED
}

因此，如果您尝试填充您的商店，它将如下所示：

const blogContentsState: BlogContents = {
  byId: {
    blogContentId0: {
      id: 'idBlogContent0',
      // ...
      actualContentIds: ['actualContentId0', 'actualContentId1', 'actualContentId2']
    }
  },
  allIds: ['blogContentId0']
};

const actualContentState: ActualContents = {
  byId: {
    actualContentId0: {
      id: 'actualContentId0',
      // ...
    },
    actualContentId1: {
      id: 'actualContentId1',
      // ...
    },
    actualContentId2: {
      id: 'actualContentId2',
      // ...
    }
  },
  allIds: ['actualContentId0', 'actualContentId1', 'actualContentId2']
};

在您的逻辑或视图中（例如使用Angular），您需要嵌套结构，以便可以迭代数组，因此，您不希望迭代ID的字符串数组。相反，您希望

actualContent:actualContent[]

为此，您需要创建一个
选择器
。每当你的商店发生变化时，你的选择器就会启动，并为你的原始数据生成一个新的“视图”

// assuming that you can blogContentsState and actualContentsState from your store
const getBlogContents = (blogContentsState, actualContentsState) =>
  blogContentsState
    .allIds
    .map(blogContentId => ({
      ...blogContentsState.byId[blogContentId],

      actualContent: blogContentsState
        .byId[blogContentId]
        .actualContentIds
        .map(actualContentId => actualContentsState.byId[actualContentId])
    }));

我知道一开始要处理的事情很多，我邀请你阅读

在学习ngrx时，您可能想看看我做的一个名为Pizza Sync的小项目。这是一个项目，我做过类似的演示：）。（你也应该安装，看看商店怎么样）

如果您感兴趣，我制作了一个小视频，只关注带Pizza Sync的Redux：
通常如何规范化数据？后端或使用normalizer或以相同格式存储数据？这是一个好问题：）！在工作中，我们确实有一个API，但用户使用它毫无意义。所以我们决定后端应该直接发送规范化数据。如果您想使用公共（经典）RESTAPI，或者如果您打算打开API，我建议您使用normalizer。感谢您的解释。它能清除很多东西。很高兴听到它！：）@仅供参考，有一个问题（来自没有足够代表评论的用户）与此答案有关。
// assuming that you can blogContentsState and actualContentsState from your store
const getBlogContents = (blogContentsState, actualContentsState) =>
  blogContentsState
    .allIds
    .map(blogContentId => ({
      ...blogContentsState.byId[blogContentId],

      actualContent: blogContentsState
        .byId[blogContentId]
        .actualContentIds
        .map(actualContentId => actualContentsState.byId[actualContentId])
    }));