當前位置：首頁 >

angular-过滤器

發布時間：2023/12/10 29 豆豆

生活随笔收集整理的這篇文章主要介紹了 angular-过滤器小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

過濾器描述

currency	格式化數字為貨幣格式。
filter	從數組項中選擇一個子集。
lowercase	格式化字符串為小寫。
orderBy	根據某個表達式排列數組。
uppercase	格式化字符串為大寫。

內容中：數值轉為貨幣格式

<p>總價 = {{ (quantity * price) | currency }}</p>

排序

<ul><li ng-repeat="x in names | orderBy:'country'">{{ x.name + ', ' + x.country }}</li> </ul>

內容中：轉小寫

<p>姓名為 {{ lastName | lowercase }}</p>

內容中：轉大小寫

<body ng-app="myApp"><div ng-controller="myCtrl"><input type="text" ng-model="name"/><input type="text" ng-model="age"/><p>調用控制器里的函數：{{info()|lowercase}}</p></div><script type="text/javascript">var app=angular.module('myApp',[]);app.controller("myCtrl",function($scope){$scope.name="Youyuanyuan";$scope.age=10;$scope.info=function(){//注意變量前加上$scopereturn $scope.name+" "+$scope.age;}})</script></body>

排序：在ng-repeat之后

{{x}}
{{x.name+" "+x.age}}

<body ng-app="myApp"><div ng-controller="myCtrl"><input type="text" ng-model="name" /><input type="text" ng-model="num" /><p>{{"名稱："+name+"，單價："+price+"，數量："+num}}</p><p>總價：{{ (price * num) | currency }}</p></div><ul ng-controller="myCtrl"><li ng-repeat="x in sum|orderBy">{{x}}</li></ul><ul ng-controller="myCtrl"><li ng-repeat="x in info|orderBy:'age'">{{x.name+" "+x.age}}</li></ul><script type="text/javascript">var app = angular.module('myApp', []);app.controller("myCtrl", function($scope) {$scope.name = "apple";$scope.num = 10;$scope.price = 20;$scope.sum =[10,30,20];$scope.info=[{name:"youyunayuan",age:20},{name:"youqijia",age:30},{name:"youlonglong",age:10},{name:"zhengshaonong",age:5}];})</script></body>

轉載于:https://www.cnblogs.com/sakura-sakura/p/6678836.html

總結

以上是生活随笔為你收集整理的angular-过滤器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇： csdn怎样注册？不想用微信
下一篇： R软件和扩展包的升级及R语言数据对象