Question

我正在构建一个具有资产的应用程序，并且每个资产都有许多注释。现在在我的应用程序中，我循环我的资产，在那里我循环我的笔记。像这样

<div class="asset-image-container" ng-repeat="asset in assets" data-asset-key="{{ asset.key }}">
                <img class="asset-page" src="{{asset.large_asset_path}}"/>
                <div ng-repeat="note in asset.notes" class="note-pin" data-note-index="{{ note.index }}" data-asset-key="{{ asset.key }}"  style="left: {{ note.x }}%; top: {{ note.y }}%;">
                    <span class="note-index">{{ note.index }}</span>
                    <img src="/img/note.png">
                </div>

在同一页面上，我还想在没有资产的列表中显示我的所有笔记。所以我需要2 ng重复，但第一个应该没有html元素。我有什么想法可以解决这个问题吗？

更新

我添加了我的模型以使其更清晰：

[  
   {  
      "id":69,
      "upload_id":16,
      "name":"preview-1",
      "key":"l476IU94c9YhyvUByZnnr162bbO3uKs3bcWVXSpG",
      "created_at":"2014-11-25 20:41:30",
      "updated_at":"2014-11-25 20:41:30",
      "deleted_at":null,
      "large_asset_path":"\/uploads\/vtbwCn1ISkRYCewaYtQE9qwDdXmpWcUohlcQAnzc\/large\/preview-1.jpg",
      "small_asset_path":"\/uploads\/vtbwCn1ISkRYCewaYtQE9qwDdXmpWcUohlcQAnzc\/small\/preview-1.jpg",
      "notes":[  
         {  
            "id":13,
            "index":13,
            "key":"oidSFwkyYhPmA9TK0XCLU4Jg52nJHA2E9CIv59Lw",
            "upload_id":16,
            "asset_id":69,
            "from_id":1,
            "message":"\n            ",
            "created_at":"2014-12-07 08:46:58",
            "updated_at":"2014-12-07 08:47:52",
            "deleted_at":null,
            "x":"71.67796920821115",
            "y":"8.503401360544217",
            "parameters":[  
               {  
                  "id":25,
                  "note_id":13,
                  "name":"x",
                  "value":"71.67796920821115",
                  "created_at":"2014-12-07 08:46:58",
                  "updated_at":"2014-12-07 08:47:51",
                  "deleted_at":null
               },
               {  
                  "id":26,
                  "note_id":13,
                  "name":"y",
                  "value":"8.503401360544217",
                  "created_at":"2014-12-07 08:46:58",
                  "updated_at":"2014-12-07 08:46:58",
                  "deleted_at":null
               }
            ]
         },
         {  
            "id":63,
            "index":50,
            "key":"CRZGM6XbRJzgWyq4Vmt1BUuRnOlBCnNQs4lHGRu8",
            "upload_id":16,
            "asset_id":69,
            "from_id":1,
            "message":null,
            "created_at":"2014-12-07 08:49:21",
            "updated_at":"2014-12-07 08:49:21",
            "deleted_at":null,
            "x":"0",
            "y":"0",
            "parameters":[  
               {  
                  "id":125,
                  "note_id":63,
                  "name":"x",
                  "value":"0",
                  "created_at":"2014-12-07 08:49:21",
                  "updated_at":"2014-12-07 08:49:21",
                  "deleted_at":null
               },
               {  
                  "id":126,
                  "note_id":63,
                  "name":"y",
                  "value":"0",
                  "created_at":"2014-12-07 08:49:21",
                  "updated_at":"2014-12-07 08:49:21",
                  "deleted_at":null
               }
            ]
         }
      ],
      "upload":{  
         "id":16,
         "key":"vtbwCn1ISkRYCewaYtQE9qwDdXmpWcUohlcQAnzc",
         "name":"annots.pdf",
         "type":"application\/pdf",
         "size":393314,
         "status_id":1,
         "created_at":"2014-11-25 20:41:29",
         "updated_at":"2014-11-25 20:41:29",
         "deleted_at":null
      }
   },
   ...
]

Answer 1

正如Phill所说，我建议你创建一个笔记列表然后迭代它们，如下所示：

for (var i = 0, asset; asset = $scope.assets[i]; i++) {
  $scope.notes = $scope.notes || [];
  $scope.notes.concat(asset.notes);
}

然后在视图中：

<div ng-repeat="note in notes">
   {{note}}
</div>

内部元素的重复重复

1 个答案: