javascript - Angular 2 - 如何迭代包含对象数组的 JSON 响应?

标签 javascript angularjs angular

我正在使用我 friend 创建的 Web API,以下是示例响应:

{
  types: [
    {
      id: 1,
      contents: [
        {
          id: 1001,
          perishable: 0
        },
        {
          id: 1002,
          perishable: 0
        }
      ]
    }
  ]
}

因此,如果我收到的响应包含 3 种类型的内容,并且每种类型都有 3 个内容,那么在下面的场景中如何使用转发器?我能够正确获取类型 ID,但在重复内容时遇到问题。

<div *ngFor="let type of response.types">
  <h2>{{type.id}}</h2>
  <!-- here I want to show basically divs for each of the objects in contents -->
  <div *ngFor="what should I do here?">
    <p>{{content.id}}</p>
    <p>{{content.perishable}}</p>
  </div>
</div>

最佳答案

<div *ngFor="let type of response.types">
  <h2>{{type.id}}</h2>

       <div *ngFor="let content of type.contents">
            <p>{{content.id}}</p>
            <p>{{content.perishable}}</p>
        </div>

</div>

关于javascript - Angular 2 - 如何迭代包含对象数组的 JSON 响应?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38681583/

相关文章:

Javascript 最后一个字母被 chop

javascript - 是否可以撤消 jquery .html()?

javascript - 在 IE8 中按 Enter 键意外触发 ng-click

javascript - 无法通过 Angular 2 数据绑定(bind)从服务访问返回的对象属性

html - 如何通过单击按钮创建 Material 卡?

javascript - Vuejs 变量赋值错误

javascript - 如何检测Android浏览器而不是Android应用程序(WebView)?

javascript - Web API CORS 未返回正确的 Access-Control-Allow-Origin header

asp.net - Angular.js 从 ASP.NET Controller 简单获取对象

angular - 如何让component.ts在加载模板之前加载所有响应?