簡體   English   中英

Angular js ng-repeat和過濾器

[英]Angular js ng-repeat and filter

我有一個嵌套的ng-repeat 我想通過動態選項安排內部列表的順序。

sort_option值來自動態獲取的$scope變量。 這將使ul列表中的所有內容都按排序順序排列,但我只想對循環內的一個列表進行排序。

<ul>
<li ng-repeat='itemsli in mylists.lists'>
 <ul>
 <li ng-repeat="item in list | orderBy: sort_option | filter: {due_date_time : current_date_time}">
  {{item.name}}
 </li>
</ul>
</li>
</ul>

像這樣更改行,在過濾器的末尾添加: true

 <li ng-repeat="item in list | orderBy: sort_option | filter: {due_date_time : current_date_time}: true ">

我不確定我是否正確理解你

但是我創建了像您一樣的示例代碼 ,看起來效果很好

列表是

$scope.firstLists = [{id: 2},{id: 1},{id: 3}];
$scope.secondLists = [{id: 2},{id: 1},{id: 3}];

<ul>
<li ng-repeat='itemsli in firstLists'>
  <ul>
     <li ng-repeat="item in secondLists | orderBy: 'id'">
     {{item.id}} of {{itemsli.id}}
     </li>
  </ul>
</li>
</ul>

結果是

1 of 2
2 of 2
3 of 2
1 of 1
2 of 1
3 of 1
1 of 3
2 of 3
3 of 3

其實我有代碼:

<ul>
<li ng-repeat='itemsli in mylists.lists'>
<md-button ng-click="sortby_cards('vote')">Sort by votes</md-button>
<md-button ng-click="sortby_cards('attachment_count')">Sort by Attachments
</md-button>

 <ul>
 <li ng-repeat="item in list | orderBy: sort_option | filter: {due_date_time : current_date_time}">
  {{item.name}}
 </li>
</ul>
</li>
</ul>

在控制器中:

$scope.sortby_cards = function(sort_value){
    console.log(sort_value);
    $scope.sort_option = sort_value;
}

當我單擊按投票排序按鈕時,按其投票順序按列表中的特定順序排序。 我想你現在明白我的問題了。

我得到答案:

<ul>
<li ng-repeat='lists in mylists.lists'>
<md-button ng-click="sortby_cards('vote', lists)">Sort by votes</md-button>
<md-button ng-click="sortby_cards('attachment_count', lists)">Sort by Attachments
</md-button>

 <ul>
 <li ng-repeat="item in list | orderBy: list.sort_option | filter: {due_date_time : current_date_time}">
  {{item.name}}
 </li>
</ul>
</li>
</ul>

在控制器中:

$scope.sortby_cards = function(sort_value,list){
    $scope.sort_option = sort_value;
    $scope.sort_index_val = index_val;
    list.sort_option = sort_value;
  }

這是正確的答案。

Thanku Farzad Salimi Jazi。

您是否正在尋找這種嵌套的ng-repeat?

var app = angular.module('soApp', []);
app.controller('soController', function ($scope) {
    $scope.firstName = "John";
    $scope.lastName = "Doe";
    $scope.sortby_cards = function (sort_value) {
        console.log(sort_value);
        $scope.sort_option = sort_value;
    };
    $scope.firstLists = [{name: "def", vote: 2}, {name: "ret", vote: 1}, {name: "ghj", vote: 3}];
    $scope.secondLists = [{name: "pqr", vote: 2, attachment_count: 1},
        {name: "abc", vote: 1, attachment_count: 3},
        {name: "xyz", vote: 3, attachment_count: 2}];
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM