如何在角度上迭代對象數組，但只顯示{{}}屬性？

Question

假設我們有一個對象數組：

var items = [ 
    { 
    id: 1, 
    name: 'name1' 
    }, { 
    id: 2, 
    name: 'name2' 
    }, 
    { 
    id: 3, 
    name: 'name3' 
    } 
]; 

，我們希望以此來遍歷它在HTML：

{{ctrl.items}} 

期待這在UI：

name1, name2, name3 

這是可能？或者我必須使用ngRepeat嗎？

我想主要是這樣做是爲了採取內部limitTo過濾器的優勢{{}}

Answer 1

您可以同時使用NG-重複和limitTo過濾器實現這一點：

<div ng-repeat="item in items | limitTo: 3">{{ item.name }}</div> 

編輯：

Here is a working plunkr.

Answer 2

，你可以在你的HTML

{{ctrl.getNames(ctrl.items)}} 

，並在控制器中添加此功能，使用這樣的代碼

this.getNames = function(items){ 
    return items.map(function(item){return item.name;}).join(", "); 
} 

，也可以彌補這方面的過濾器,,

app.filter("names",function(){ 
    return function(input){ 
     return input.map(function(item){return item.name;}).join(", "); 
    }; 
}); 

，並在你的HTML中使用這

{{ctrl.items | names}}