本篇文章為大家展示了filter如何在AngularJS中使用,內(nèi)容簡(jiǎn)明扼要并且容易理解,絕對(duì)能使你眼前一亮,通過這篇文章的詳細(xì)介紹希望你能有所收獲。
創(chuàng)新互聯(lián)建站主要業(yè)務(wù)有網(wǎng)站營(yíng)銷策劃、成都網(wǎng)站設(shè)計(jì)、網(wǎng)站制作、外貿(mào)營(yíng)銷網(wǎng)站建設(shè)、微信公眾號(hào)開發(fā)、小程序制作、H5場(chǎng)景定制、程序開發(fā)等業(yè)務(wù)。一次合作終身朋友,是我們奉行的宗旨;我們不僅僅把客戶當(dāng)客戶,還把客戶視為我們的合作伙伴,在開展業(yè)務(wù)的過程中,公司還積累了豐富的行業(yè)經(jīng)驗(yàn)、全網(wǎng)整合營(yíng)銷推廣資源和合作伙伴關(guān)系資源,并逐漸建立起規(guī)范的客戶服務(wù)和保障體系。一、格式化數(shù)字為貨幣格式。
<div>{{money|currency:"$"}}</div> <div>{{money|currency:"RMB"}}</div>
script:
app.controller("crl", function($scope, $filter) { $scope.money="4545"; });
顯示為
二、lowercase 格式化字符串為小寫。
姓名為 {{ lastName | lowercase }}
app.controller("crl", function($scope, $filter) { $scope.lastName ="AAA"; });
顯示為
aaa
三、uppercase 格式化字符串為大寫。
姓名為 {{ lastName | uppercase }}
app.controller("crl", function($scope, $filter) { $scope.lastName ="aaa"; });
顯示為
AAA
四、filter 從數(shù)組項(xiàng)中選擇一個(gè)子集。
<div>{{array|filter:"s"}}</div> <div ng-repeat="item in array|filter:'s'">{{item.name}}</div>
app.controller("crl", function($scope, $filter) { $scope.array = [ { name : 'Tobias' }, { name : 'Jeff' }, { name : 'Brian' }, { name : 'Igor' }, { name : 'James' }, { name : 'Brad' } ]; });
顯示為
[{"name":"Tobias"},{"name":"James"}] Tobias James
五、orderBy 根據(jù)某個(gè)表達(dá)式排列數(shù)組。
輸入過濾器可以通過一個(gè)管道字符(|)和一個(gè)過濾器添加到指令中,該過濾器后跟一個(gè)冒號(hào)和一個(gè)模型名稱。模型名字前加負(fù)號(hào)為降序,默認(rèn)為升序
<div ng-repeat="item in array|orderBy:'-name'">降序 {{item.name}}</div> <div ng-repeat="item in array|orderBy:'name'">升序 {{item.name}}</div>
app.controller("crl", function($scope, $filter) { $scope.array = [ { name : 'Tobias',age:"18" }, { name : 'Jeff',age:"19" }, { name : 'Brian',age:"19" }, { name : 'Igor',age:"55" }, { name : 'James',age:"19" }, { name : 'Brad',age:"19" } ,{ name : 'aaas',age:"19" }]; });
顯示為
降序 Tobias 降序 Jeff 降序 James 降序 Igor 降序 Brian 降序 Brad 降序 aaas 升序 aaas 升序 Brad 升序 Brian 升序 Igor 升序 James 升序 Jeff 升序 Tobias
5.1.多個(gè)模型排序(先按名字排序在按年齡排序)
<div ng-repeat="item in array|orderBy:['name','age']">升序 {{item.name}}{{item.age}}</div>
app.controller("crl", function($scope, $filter) { $scope.array = [ { name : 'Tobias',age:"18" }, { name : 'Jeff',age:"19" }, { name : 'Brian',age:"19" }, { name : 'Igor',age:"55" }, { name : 'James',age:"19" }, { name : 'adsd',age:"19" } ,{ name : 'adsd',age:"20" }]; });
顯示為
升序 adsd19 升序 adsd20 升序 Brian19 升序 Igor55 升序 James19 升序 Jeff19 升序 Tobias18
上述內(nèi)容就是filter如何在AngularJS中使用,你們學(xué)到知識(shí)或技能了嗎?如果還想學(xué)到更多技能或者豐富自己的知識(shí)儲(chǔ)備,歡迎關(guān)注創(chuàng)新互聯(lián)成都做網(wǎng)站行業(yè)資訊頻道。
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無理由+7*72小時(shí)售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì),專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。
分享名稱:filter如何在AngularJS中使用-創(chuàng)新互聯(lián)
文章URL:http://bm7419.com/article2/dpceoc.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站內(nèi)鏈、網(wǎng)站收錄、ChatGPT、域名注冊(cè)、微信公眾號(hào)、網(wǎng)站改版
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)