Javascript 对象嵌套数组上的循环

我很难尝试使用ng7在嵌套对象数组上循环

这是我掌握的数据：

data = { 
    'title1': [
    {
      active: true, 
      id: 1 
    },
  {
      active: true, 
      id: 2 
    },
  {
      active: true, 
      id: 3 
    },
  {
      active: true, 
      id: 4 
    }],
  'title2': [
   {
      active: true, 
      id: 1 
    },
  {
      active: true, 
      id: 2 
    },
  {
      active: true, 
      id: 3 
    },
  {
      active: true, 
      id: 4 
    }]              
}

我需要打印标题，例如“title1”，其余数据应嵌套显示，问题是，无论何时我采用这种方法，一切看起来都正常：

 <ul>
    <li *ngFor="let item of data| keyvalue">
        <p>{{ item.key }}</p> 
        <p *ngFor="let children of item.value | keyvalue" >
            {{ children.value.id}}
        </p>
    </li>
  </ul>

{{item.key}}


{{children.value.id}

但每当我将布局切换到如下输入复选框时：

       <ul>
        <li *ngFor="let item of data| keyvalue">
            <p>{{ item.key }}</p> 
            <label>
                <input type="checkbox" name="events" *ngFor="let children of item.value | keyvalue" />
                event item {{ children.value.id}}
            </label>
        </li>
      </ul>

{{item.key}}

事件项{children.value.id}

我在浏览器的控制台上遇到以下错误，但未呈现任何内容：

错误类型错误：无法读取未定义的属性“值” 在上的Object.eval[as updateRenderer]处

{{item.key}

---

有什么想法吗？我确信我遗漏了一些愚蠢的东西，

您的

子对象

引用在引用它时不在范围内，因为

事件项{{children.value.id}

字符串不包含在

元素中

在

而不是

元素上定义循环：

<ul>
  <li *ngFor="let item of data | keyvalue">
      <p>{{ item.key }}</p> 
      <label *ngFor="let children of item.value | keyvalue">
          <input type="checkbox" name="events" />
          event item {{children.value.id}}
      </label>
  </li>
</ul>

{{item.key}}

事件项{children.value.id}

对不起，我在写数据时输入了一个错误，editedIt本来不是数组，但是一个对象更改了第一个[]的花括号可能是重复的，我看到了您对

数据

对象所做的更改，但我看不到底部两个代码片段之间有任何区别。他们看起来和我一模一样。把你的ng放在标签上。是这样的，非常感谢，先生。也谢谢你的解释。