Угловое отображение js: ng-repeat в виде строки json

0

Я обрабатываю json-ответ в функции map позже, он отображается в ng-repeat

//from api call
    $scope.todos=response.data;
    //processing 
    $scope.todos = $scope.todos.map(function(text, status,note,create_date,to_do_id) {
           var ch;
           if(status=='1') ch=true; else ch=false;
              console.log(ch);
              return{
                text,
                flag:ch,
                note:note,
                to_do_id:to_do_id,
                create_date:create_date,
                status:status
              };
          });

но когда я попытаюсь отобразить его в html, он будет отображаться как полная строка json.

<div class="list-expense-menu-item" ng-repeat="todo in todos">
 {{todo.note}}
</div>

я пробовал

$scope.todos=JSON.stringify($scope.todos);

но он выдает сообщение об ошибке

Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: todo in todos, Duplicate key: string:t, Duplicate value: t

Заметка:

Без функции отображения ng-repeat работает отлично

ОБНОВЛЕНИЕ Вот мои данные

[{"text":{"to_do_id":"53","note":"test todo update","status":"0","is_enabled":"1","create_date":"2016-06-04T21:46:35+0530","completed_date":"2016-06-04T22:17:53+0530","exp_date":"0000-00-00T00:00:00+0530"},"flag":false,"note":[{"to_do_id":"53","note":"test todo update","status":"0","is_enabled":"1","create_date":"2016-06-04T21:46:35+0530","completed_date":"2016-06-04T22:17:53+0530","exp_date":"0000-00-00T00:00:00+0530"},{"to_do_id":"52","note":"new hello todo","status":"0","is_enabled":"1","create_date":"2016-06-04T21:40:30+0530","completed_date":"2016-06-05T00:06:28+0530","exp_date":"0000-00-00T00:00:00+0530"}],"status":0},{"text":{"to_do_id":"52","note":"new hello todo","status":"0","is_enabled":"1","create_date":"2016-06-04T21:40:30+0530","completed_date":"2016-06-05T00:06:28+0530","exp_date":"0000-00-00T00:00:00+0530"},"flag":true,"note":[{"to_do_id":"53","note":"test todo update","status":"0","is_enabled":"1","create_date":"2016-06-04T21:46:35+0530","completed_date":"2016-06-04T22:17:53+0530","exp_date":"0000-00-00T00:00:00+0530"},{"to_do_id":"52","note":"new hello todo","status":"0","is_enabled":"1","create_date":"2016-06-04T21:40:30+0530","completed_date":"2016-06-05T00:06:28+0530","exp_date":"0000-00-00T00:00:00+0530"}],"status":1}]
  • 0
    когда вы вызываете $scope.todos.map.. тогда ваш результат содержит дубликаты данных. поэтому попробуйте использовать ng-repeat="todo in todos track by $index" .
  • 0
    Вы пробовали ng-repeat = "todo in todos track by $ index"?
Показать ещё 3 комментария
Теги:
cordova

1 ответ

2
Лучший ответ

Я думаю, у вас есть два вложенных ng-repaet для этого. также я использую цикл forEach для flag модификации.

var app = angular.module("app" , []);
app.controller("MyCtrl" , function($scope){
  
  $scope.todos = [
  {
    "text": {
      "to_do_id": "53",
      "note": "test todo update",
      "status": "0",
      "is_enabled": "1",
      "create_date": "2016-06-04T21:46:35+0530",
      "completed_date": "2016-06-04T22:17:53+0530",
      "exp_date": "0000-00-00T00:00:00+0530"
    },
    "note": [
      {
        "to_do_id": "53",
        "note": "test todo update",
        "status": "0",
        "is_enabled": "1",
        "create_date": "2016-06-04T21:46:35+0530",
        "completed_date": "2016-06-04T22:17:53+0530",
        "exp_date": "0000-00-00T00:00:00+0530"
      },
      {
        "to_do_id": "52",
        "note": "new hello todo",
        "status": "0",
        "is_enabled": "1",
        "create_date": "2016-06-04T21:40:30+0530",
        "completed_date": "2016-06-05T00:06:28+0530",
        "exp_date": "0000-00-00T00:00:00+0530"
      }
    ],
    "status": 0
  },
  {
    "text": {
      "to_do_id": "52",
      "note": "new hello todo",
      "status": "0",
      "is_enabled": "1",
      "create_date": "2016-06-04T21:40:30+0530",
      "completed_date": "2016-06-05T00:06:28+0530",
      "exp_date": "0000-00-00T00:00:00+0530"
    },
    "note": [
      {
        "to_do_id": "53",
        "note": "test todo update",
        "status": "0",
        "is_enabled": "1",
        "create_date": "2016-06-04T21:46:35+0530",
        "completed_date": "2016-06-04T22:17:53+0530",
        "exp_date": "0000-00-00T00:00:00+0530"
      },
      {
        "to_do_id": "52",
        "note": "new hello todo",
        "status": "0",
        "is_enabled": "1",
        "create_date": "2016-06-04T21:40:30+0530",
        "completed_date": "2016-06-05T00:06:28+0530",
        "exp_date": "0000-00-00T00:00:00+0530"
      }
    ],
    "status": 1
  }
];
 
  angular.forEach($scope.todos,function(todo){
        if(todo.status == 1)
          todo.flag = true;
         else
           todo.flag = false;
           
    })
             
  
   console.log($scope.todos);
  
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="MyCtrl">
  
        <div class="list-expense-menu-item" ng-repeat="todo in todos">
                 <div ng-repeat="note in todo.note">
                   <span>{{note.to_do_id}}</span> |
                    <span>{{note.note}}</span>|
                    <span>{{note.status}}</span>|
                    <span>{{note.create_date}}</span>
                 </div>
       </div>
  
  </div>
  • 0
    Позвольте мне попробовать ваш ответ
  • 0
    flag не находится в ответе JSOn, я добавил, что
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню