如何在angularjs 4中使用json对象处理复选框

我在复选框中显示了以下数据

roomLists = {'4': {'name': 'Standard Room', 'typeID': '4', 'price': 100}, '5': {'name': 'Delux Room', 'typeID': '5', 'price': 100}}

使用http检索此json对象。出于测试目的，我将其存储在roomlist中

使用管道，数据在模态内部得到正确显示

 <app-modal #modal1>
   <div class="app-modal-body">
    <div *ngFor="let room of roomLists | jsonPipe">
     <label>
      <input type="checkbox"/>{{room.name}}
     </label>
   </div>
 </div>

{{room.name}

---

但当我尝试点击复选框时，它并没有被点击。是我在代码中缺少的东西。

我猜您正在将

复选框

与其自己的

标签

配对，您可以尝试为复选框指定一个

id

，并为绑定到复选框id的

属性指定一个

<div *ngFor="let room of roomLists | jsonPipe; let i = index;">
  <label for="{{'checkbox' + i}}">
    <input id="{{'checkbox' + i}}" type="checkbox"/>{{room.name}}
  </label>
</div>


{{room.name}
Angular 4？哇，他们太快了谢谢你的快速反应。我试过你的解决方案，但它不起作用。@SudhaBisht仍然无法检查？