AngularJS - 納克重複不帶地圖輸入命名的長度和值0

Question

工作，我想，以顯示與子事件我從API獲得的JSON

[ 
{ 
"class":"de.ff.prg.EventItem", 
"id":27667, 
"additional_info":null, 
"comments":null, 
"event":{"class":"Event","id":27657}, 
"length":0, 
"runningorder":0, 
"screening":{"class":"Screening","id":27529}, 
"title_eng":"'71", 
"title_ger":"'71", 
"venue":{"class":"Venue","id":1}}, 

{"class":"de.ff.prg.EventItem", 
"id":27676, 
"additional_info":null, 
"comments":null, 
"event":{"class":"Event","id":27657}, 
"length":5, 
"runningorder":0, 
"screening":null, 
"title_eng":"NEW", 
"title_ger":"NEW", 
"venue":{"class":"Venue","id":8} 
} 
] 

活動爲了顯示的字段項目在行中，而不是在列中，我用ng-repeat嵌套了兩個表格，以便我得到一張表格。

<!--Items--> 
<table> 
    <thead> 
     <td colspan="6" style="background-color: #b9da73"> 
      <button class="btnAdd" ng-click="addAndEditEventItem()">Add Item</button> 
     </td> 
    </thead> 
    <tbody> 

     <tr ng-repeat="item in eventItems"> 
      <h1>{{eventItems.length}}</h1> 
      <th> 

      <table> 
       <thead> 
        <td colspan="2" style="background-color: #c0da86">{{item.runningorder}}</td> 
        <td colspan="4" style="background-color: #c0da86"> 
         <button class="btnAdd" ng-click="deleteEventItem(item.id)">Delete Item</button> 
        </td> 
       </thead> 
       <tbody> 
       {{item}} 
        <tr ng-repeat="(key,value) in item"> 
         <th colspan="2" style="background-color: #ceeca1">{{key}}</th> 
         <th colspan="4" style="font-weight: normal;">{{value}} </th> 
        </tr> 
       </tbody> 
      </table> 

      </th> 
     </tr> 
    </tbody> 
</table> 

截至目前爲止，這是沒有問題的，但某處我已經失去了以顯示第一子表的主體（所有其他行渲染罰款）的可能性的方式。我在body標籤前插入了{{item}}，它顯示缺少的數據，所以它沒有問題。

任何想法？或者你需要看到其他代碼來告訴？我不知道......

這裏是一個Fiddle

Answer 1

有趣的案例。 根據經驗，我發現，這是因爲

"length":0 

只要看着角源代碼，發現其轉換對象的屬性在重複到一個數組，然後取它的長度屬性來遍歷它。

...ngRepeatDirective... 
       if (isArrayLike(collection)) { 
       collectionKeys = collection; 
       trackByIdFn = trackByIdExpFn || trackByIdArrayFn; 
       } else { 
       trackByIdFn = trackByIdExpFn || trackByIdObjFn; 
       // if object, extract keys, sort them and use to determine order of iteration over obj props 
       collectionKeys = []; 
       for (key in collection) { 
        if (collection.hasOwnProperty(key) && key.charAt(0) != '$') { 
        collectionKeys.push(key); 
        } 
       } 
       collectionKeys.sort(); 
       } 

       arrayLength = collectionKeys.length; <<<--- HERE 

       // locate existing items 
       length = nextBlockOrder.length = collectionKeys.length; <<<--- AND HERE 

所以什麼也沒有發生。

似乎實際上是一個錯誤。我已發佈issue。

只需嘗試然後迭代您的數組並更改此屬性的名稱。像：

for(var i = 0; i < $scope.eventItems.length; i++){ 
    $scope.eventItems[i].itemLength = $scope.eventItems[i].length; 
    delete $scope.eventItems[i].length; 
}