angular裡的filter過濾資料傳參

來源:互聯網
上載者:User

在ng-repeat中使用過濾器filter ,則在filter閉包內第一個參數,就是ng-repeat中的原數組,其餘參數可以在-repeat運算式中,使用filterName :param1 :param2 提供。

如果參數是$scope中的變數 , 直接寫上去即可,不用加引號。


控制器:$scope.dataList=[

{"dataClass":"0","dataName":"A1"},{"dataClass":"0","dataName":"A2"},{"dataClass":"1","dataName":"B1"},{"dataClass":"1","dataName":"B2"},{"dataClass":"2","dataName":"C1"},{"dataClass":"2","dataName":"C2"}

]
HTML模板:
<li ng-repeat="item in dataList |filter :{'dataClass':'0'}">{{item.dataName}}</li>
頁面展示將迴圈過濾出dataList數組中dataClass為'0'的A1,A2;現在的需求是dataClass過濾的值是一個變數設為varity,而ng-repeat="item in dataList |filter :{'dataClass':varity}",又不生效,請問如何?該需求

幫你寫了個過濾器,把指定的dataClass去掉了:

angular.module('common', []).filter('myFilter', function () {        return function (collection, keyname,value) {            var output = [];            angular.forEach(collection, function (item) {                //過濾數組中值與指定值相同的元素                if(item[keyname]!=value){                    output.push(item);                }            });            return output;        }    });
<div ng-app="myApp" ng-controller="myCtrl">    <p ng-repeat="x in items | myFilter: 'dataClass': dcValue ">        {{x.dataClass}}---{{x.dataName}}    </p></div>

過濾器接收3個參數,原數組,要過濾的key,以及指定的key值。

引自: angular裡的filter過濾資料傳參問題



ng-repeat 倒序迴圈

我想要用angularjs迴圈一個json數組,

<div class="gwc-div mar-t20"  ng-repeat="shopdata in cartinfo.shopList" ></div>

如果要倒敘的迴圈有什麼方法嗎。

可以這樣:

<div class="gwc-div mar-t20"  ng-repeat="shopdata in cartinfo.shopList.slice().reverse()" ></div>

或者聲明一個filter...

js:

app.filter('reverse', function() {    return function(items) {        return items.slice().reverse();    };});

view:

<div class="gwc-div mar-t20" ng-repeat="shopdata in cartinfo.shopList | reverse" ></div>
引自 : ng-repeat 倒序迴圈






 

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.