ng-repeat 在离子 1 中显示错误值

Question

<ion-item
  class="item-icon-left item-icon-right item-avatar"
  ng-repeat="note in taskDetails.notes track by note.note_id"
  ng-click="viewNote(note)">
  <i ng-show="note.status.name==Open" class="icon ion-ios-circle-outline"></i>
  <i ng-show="note.status.name!=Open"class="icon ion-ios-checkmark-outline"></i>
  <h2>{{note.note}}</h2>
  <p>{{note.created_by}}</p>
  <i class="icon ion-chevron-right icon-accessory"></i>
</ion-item>

任务对象

{"task_date_id":69069,"task_id":"3286","start_time":"2018-02-22 12:10:00","end_time":"2018-02-22 12:10:00 ","overdue_days":0,"subject":"Oneone","description":"One","status":{"id":3,"name":"Pending","enabled":null,"完成":null},"statuses":[{"id":3,"name":"Pending"},{"id":6,"name":"Assigned"},{"id":4, "name":"Closed"},{"id":17,"name":"Complete"}],"type":{"id":229,"name":"200_Test_Mobile_Task"},"assigned_to": "Kanishka Raveendra","address":"","clients":[],"attachments":[],"notes":[],"$$hashKey":"object:8112"}

笔记对象

{"note_id":"98834","note_date":"22/02/2018","note_type":"ABC14","time_spent":0,"note":"Xyxhxffuf\n

{$PERSON_FIRST_NAME} {$PERSON_SURNAME}

","created_by":"Kanishka Raveendra","date_created":"","attachments":[],"template":"

{$PERSON_FIRST_NAME} {$PERSON_SURNAME}

","type":{"id":52,"name":"ABC14","enabled":true,"record_time":"start_stop"}}

这里我添加了用于显示数据的Task和Note的源代码和响应。通常一个任务可以有多个notes。但是在这里我们可以清楚地看到notes数组没有元素。但是我可以看到一些notes视图中其他任务的对象。我需要在视图中显示正确的注释值。请帮助我。我是 ionic 新手。

控制台错误

错误：[ngRepeat:dupes] 不允许在转发器中重复。使用“track by”表达式指定唯一键。中继器：taskDetails.notes 中的注释由 note.note_id 跟踪，重复键：98834，重复值：{"note_id":"98834","note_date":"22/02/2018","note_type":"ABC14", "time_spent":0,"note":"Xyxhxffuf\n

{$PERSON_FIRST_NAME} {$PERSON_SURNAME}

","created_by":"Kanishka Raveendra","date_created":"","attachments":[],"template":"

{$ PERSON_FIRST_NAME} {$PERSON_SURNAME}

","type":{"id":52,"name":"ABC14","enabled":true,"record_time":"start_stop"}}

Answer 1

在您的track by note.note_id 中获得相同的值。

使用$index，它是ng-repeat中重复元素（0..length-1）的迭代器偏移量。

更多详情请查看here。

使用以下解决方案：

      <ion-item
        class="item-icon-left item-icon-right item-avatar"
        ng-repeat="note in taskDetails.notes track by $index"
        ng-click="viewNote(note)">
        <i class="icon" ng-class="{'ion-ios-circle-outline': note.status.name === 'Open', 'ion-ios-checkmark-outline': note.status.name !== 'Open'}"></i>

        <h2>{{note.note}}</h2>
        <p>{{note.created_by}}</p>
        <i class="icon ion-chevron-right icon-accessory"></i>
      </ion-item>

希望对你有帮助！！

Answer 2

试试这个

<ion-item
        class="item-icon-left item-icon-right item-avatar"
        ng-repeat="(key, value) in taskDetails.notes track by $index"
        ng-click="viewNote(note)">
        ......
</ion-item>