AngularJs通過列值

分離結果爲Div時我一直在努力找出如何在這種情況下，引導COL-MD-4的顯示我的結果到單獨的div上的邏輯。這是一個聊天消息應用程序，我正在嘗試構建。有些房間和消息我希望每個房間只顯示分組在一起的消息。AngularJs通過列值

我的結果（$ scope.messages）看起來像：

messages = [ 
    {"room_id":1,"message_id":2,"message_content":"hiiii","message_time":"2015-11-28 23:22:57","user_name":"Aaaa1aa"}, 
    {"room_id":1,"message_id":1,"message_content":"hi there","message_time":"2015-11-28 23:22:40","user_name":"aaaa2aa"}, 
    {"room_id":2,"message_id":3,"message_content":"hyyy","message_time":"2015-11-28 23:23:07","user_name":"Guest"}, 
    {"room_id":2,"message_id":4,"message_content":"aaaaa","message_time":"2015-11-28 23:23:20","user_name":"aaaa2aa"} 
];

我要顯示的每個結果集由ROOM_ID列分組，以便通過數據中繼時，這套看起來像這樣

<div class="col-md-4"> Room Id - 1 
aaaa2aa - hi there 
Aaaa1aa - hiiii 
</div> 

<div class="col-md-4"> Room Id - 2 
Guest - hyyy 
aaaa2aa - aaaaa 
</div>

我覺得這樣的事情威力工作嘗試其他幾個選項之後，但它不提供任何結果。

<div class="col-md-4" ng-repeat="data in messages"> 
<div ng-repeat="data in data[$index]"> 

{{data.user_name}} 
{{data.message_content}} 

</div> 
</div>

感謝您的任何幫助。

這是對我工作，但你必須先添加模塊過濾器的依賴性：

<div class="col-md-4" ng-repeat="data in messages | groupBy: 'room_id'"> 
    {{data[$index].room_id}} 
<div ng-repeat="data in data"> 
    {{data.user_name}} 
    {{data.message_content}} 
    </div> 
</div>

來源

2015-11-29 Spade

您可以使用groupBy分組結果：

(k, v) in messages | groupBy: 'room_id'

另一個解決方案是使用filter：

<div class="col-md-4" ng-repeat="data in messages | filter: '{'room_id': 2}'"> //show only items with room_id set to 2 and so on 

</div>

但是，這個我這將是重複和多餘的。

來源

2015-11-29 06:19:03

這就是我想的，但由於某種原因，它提供了這個錯誤，並沒有返回任何結果：https://docs.angularjs.org/error/$injector/unpr?p0=groupByFilterProvider – Spade

編輯答案。通過替換'數據「（K，V）」 –

這兩種解決方案給相關性錯誤：https://docs.angularjs.org/error/$injector/unpr?p0=groupByFilterProvider – Spade

AngularJs通過列值

回答

相關問題