angularjshtml過濾器

『壹』 angularjs 控制器中怎樣使用過濾器

內置過濾器也可以在js文件中使用，只要在angularjs組件定義時注入$filter組件，即可在內代碼中使用過容濾器。
app.controller('testC',['$scope','$filter',function($scope,$filter){
$scope.num = $filter('currency')(123534);
$scope.date = $filter('date')(new Date());
]}

『貳』 如何擁有AngularJS輸出轉義HTML

在用angular作為前端搭建個人博客的時候，發現用AngularJS輸出html的時候，瀏覽器並不解析這些html標簽，不知道angularjs如何實現這種功能的。但是這里我們需要其顯示angular輸出的html能被瀏覽器解析怎麼呢？通過api，發現通過指令ng-bind-html來實現html的輸出。[html]viewplain在CODE上查看代碼片派生到我的代碼片但是並不起作用，瀏覽器中顯示的還是html代碼。『後來發現還需要通過通過$sce服務來實現html的展示。[html]viewplain在CODE上查看代碼片派生到我的代碼片angular.mole("list",[]).controller("BlogListCtrl",BlogListCtrl).filter('to_trusted',['$sce',function($sce){returnfunction(text){return$sce.trustAsHtml(text);}}])這里通過$sce構建一個過濾器來對輸出的html進行過濾[html]viewplain在CODE上查看代碼片派生到我的代碼片這樣就可以通過angularjs正常的輸出html標簽，並且被瀏覽器解析了

『叄』 angularjs $filter過濾器問題

推薦使用angular-ui-grid：
controller：
varapp=angular.mole('app',['ngTouch','ui.grid','ui.grid.pagination']);

app.controller('MainCtrl',['$scope','$http',function($scope,$http){
$scope.gridOptions1={
paginationPageSizes:[25,50,75],
paginationPageSize:25,
columnDefs:[
{name:'name'},
{name:'gender'},
{name:'company'}
]
};
}]);

html:
<divui-grid="gridOptions1"ui-grid-paginationclass="grid"></div>

『肆』 Angularjs 過濾器能獲取到過濾後的數據嗎

|AngularJS的內置過濾器使用方法:
一個過濾器，不帶參數的情況
{{expression | filter}}

一個過濾器，帶參數的情況
{{expression | filter:arguments}}

一個過濾器，帶多個參數的情況
{{expression | filter: arg1: arg2: ...}}

多個過濾器，不帶參數的情況
{{expression | filter1 | filter2 | ...}}
分別使用以下AngularJS的內置過濾器
currency

currency允許我們設置自己的貨幣符號，默認情況下會採用客戶端所處區域的貨幣符號。
可以這樣使用：{{ 3600 | currency: "$￥"}}
返回結果為$￥123.00
online code點擊預覽

number

number過濾器將數字格式化成文本，它的參數是可選的，用來控制小數點後的截取位數
如果傳入的是一個非數字字元，會返回空字元串
可以這樣使用：{{ 3600 | number:2}}
返回結果為：3,600.00
online code點擊預覽

lowercase

lowercase將字元串轉換為小寫
可以這樣使用：{{ "HEllo" | lowercase}}
返回結果為：hello
online code點擊預覽

uppercase

uppercase將字元串轉換為大寫
可以這樣使用：{{ "HEllo" | uppercase}}
返回結果為：HELLO
online code點擊預覽

json

json過濾器可以將一個JSON或者JavaScript對象轉換成字元串。
這個過濾器對調試相當有用
可以這樣使用：{{ {"name":"dreamapple","language":"AngularJS"} | json}}
返回結果為：{ "name": "dreamapple", "language": "AngularJS" }
online code點擊預覽

date

date過濾器將日期過濾成你想要的格式，這個實在是很好的過濾器。
這個過濾器用法很多我這里列舉幾種常用的
{{ today | date: "yyyy - mm - dd"}}
結果為：2015 - 15 - 13
{{ today | date: "yyyy - mm - dd HH:mm::ss"}}
結果為：2015 - 18 - 13 20:18::38
[online code](2015 - 18 - 13 20:18::38)

『伍』 angularjs自定義的過濾器只能用一次嗎

這個只能自己寫過濾方法版了權
function unique(arr, key){

var tempArr = arr;

for(var i = 0;i < tempArr.length;i++){

for(var j = 0;j< tempArr.length;j++){

if(tempArr[i][key] == tempArr[j][key]){

arr.splice(j,1);

}

}

}

return arr;
}
unique($scope.items,'name')

『陸』 angularjs怎麼獲取過濾器選擇後的數據

AngularJS的內置過濾器使用方法:
一個過濾器，不帶參數的情況
{{expression | filter}}

一個過濾器，帶參數的情況
{{expression | filter:arguments}}

一個過濾器，帶多個參數的情況
{{expression | filter: arg1: arg2: ...}}

多個過濾器，不帶參數的情況
{{expression | filter1 | filter2 | ...}}
分別使用以下AngularJS的內置過濾器
currency

currency允許我們設置自己的貨幣符號，默認情況下會採用客戶端所處區域的貨幣符號。
可以這樣使用：{{ 3600 | currency: "$￥"}}
返回結果為$￥123.00
online code點擊預覽

number

number過濾器將數字格式化成文本，它的參數是可選的，用來控制小數點後的截取位數
如果傳入的是一個非數字字元，會返回空字元串
可以這樣使用：{{ 3600 | number:2}}
返回結果為：3,600.00
online code點擊預覽

lowercase

lowercase將字元串轉換為小寫
可以這樣使用：{{ "HEllo" | lowercase}}
返回結果為：hello
online code點擊預覽

uppercase

uppercase將字元串轉換為大寫
可以這樣使用：{{ "HEllo" | uppercase}}
返回結果為：HELLO
online code點擊預覽

『柒』 angularjs中有多個過濾器使用方法

一、在視圖模板（View Template）中使用
在表達式中應用Filters （過濾器）
需要遵循格式如下：
{{ expression | filter }} 即 {{ 表達式 | 過濾器 }}
例如：{{ 12 | currency }} 輸出為 $12.00在輸出結果中應用Filters （過濾器）
通俗點講就是Filter的疊加--前一filter的輸出結果作為後一filter的輸入數據源.
需要遵循格式如下：
{{ expression | filter1 | filter2 | ... }} 即 表達式(expression)使用filter1過濾後再使用filter2過濾...
帶參數的Filter
Filter後面可以跟一個或多個參數，用來幫助實現特殊要求、需求的filter.
需要遵循格式如下：
{{ expression | filter:argument1:argument2:... }}
示例： {{ 1234 | number:2 }} = 1,234.00END
二、使用 AngluarJS 內置Filter
AngularJS為我們提供了9個內建的過濾器
分別是currency, date, filter, json, limitTo, uppercase， lowercase, number, orderBy。
具體的用法在AngularJS的文檔中都有詳細說明。下面只說幾個常用的。
currency filter（貨幣過濾器)
currency – 用來將變數轉換成貨幣表現形式
如：{{ amount | currency}}
uppercase/lowercase filter（字母大小寫filter）如：
{{ "lower cap string" | uppercase }}
<input ng-model="userInput"> Uppercased: {{ userInput | uppercase }}
date filter (日期filter)
如：
{{ 1304375948024 | date }}
{{ 1304375948024 | date:"MM/dd/yyyy @ h:mma" }}
json filter
如：
{{ {foo: "bar", baz: 23} | json }}
END
在controllers， services和drictives中使用filter1可以在AngularJS的controller, service或者driective中使用filter, 這時候你需要將依賴的filter名字加入到controller, service或者directive的依賴中去。
2在controller中直接使用filter， 這樣controller可以根據自身需要而適時調用filterEND
三、自定義filter（過濾器）
1AngularJS編寫自定義過濾器的形式和AngularJS的factory service非常相像，一定記得它返回一個對象或者是一個函數即可，編寫的時候，只需要一個帶有一個以上參數的函數即可。
2格式大致如：
app.filter('filter(過濾器)名稱',function(){return function(需要過濾的對象,過濾器參數1,過濾器參數2,...){//...執行業務邏輯代碼return 處理後的對象;
}
});

『捌』 anglarjs過濾器可以使用什麼字

AngularJS過濾器過濾器可以使用一個管道字元（|）添加到表達式和指令中。AngularJS過濾器可用於轉換數據：currency格式化數字為貨幣格式。filter從數組項中選擇一個子集。lowercase格式化字元串為小寫。orderBy根據某個表達式排列數組。uppercase格式化字元串為大寫。1.表達式中添加過濾器過濾器可以通過一個管道字元（|）和一個過濾器添加到表達式中。.uppercase過濾器將字元串格式化為大寫：AngularJS實例姓名為{{lastName|uppercase}}2.lowercase過濾器將字元串格式化為小寫：AngularJS實例姓名為{{lastName|lowercase}}

『玖』 如何用angularjs指定一段html拿來預覽

1.首先定義一個angularJS的過濾器，作為處理html文本的通用過濾器。
define([ "app",], function (app) {

app().registerFilter("trusted", ["$sce", function ($sce) { return function (html) { if (typeof html== 'string') //判斷類型為字元串
return $sce.trustAsHtml(html);
return html;
}
}])

});

sce 即 strict contextual escaping，嚴格模式下的上下文隔離，也可以理解為安全綁定，類似於瀏覽器的同源載入策略，不能載入不同域下的文件及不鞥呢使用不和要求的協議，angularJS為了避免安全漏洞，有些ng-src或ng-include都會進行安全檢查，避免了一些跨站的XSS。angularJS是默認開啟sce的，所以html文本得使用授權信任載入的html文本。
$sce是angularJS自帶的安全處理模塊，$sce.trustAsHtml()方法將值轉換為特權所接受並能安全地使用「ng-bind-html」，就實現在數據載入時對於html標簽的自動轉義。

『拾』 angularjs內置過濾器filter能不能獲取過濾後的數據

AngularJS的內置過濾器使用方法:
一個過濾器，不帶參數的情況
{{expression | filter}}

一個過濾器，帶參數的情況
{{expression | filter:arguments}}

一個過濾器，帶多個參數的情況
{{expression | filter: arg1: arg2: ...}}

多個過濾器，不帶參數的情況
{{expression | filter1 | filter2 | ...}}
分別使用以下AngularJS的內置過濾器
currency

currency允許我們設置自己的貨幣符號，默認情況下會採用客戶端所處區域的貨幣符號。
可以這樣使用：{{ 3600 | currency: "$￥"}}
返回結果為$￥123.00
online code點擊預覽

number

number過濾器將數字格式化成文本，它的參數是可選的，用來控制小數點後的截取位數
如果傳入的是一個非數字字元，會返回空字元串
可以這樣使用：{{ 3600 | number:2}}
返回結果為：3,600.00
online code點擊預覽

lowercase

lowercase將字元串轉換為小寫
可以這樣使用：{{ "HEllo" | lowercase}}
返回結果為：hello
online code點擊預覽

uppercase

uppercase將字元串轉換為大寫
可以這樣使用：{{ "HEllo" | uppercase}}
返回結果為：HELLO
online code點擊預覽

json

json過濾器可以將一個JSON或者JavaScript對象轉換成字元串。
這個過濾器對調試相當有用
可以這樣使用：{{ {"name":"dreamapple","language":"AngularJS"} | json}}
返回結果為：{ "name": "dreamapple", "language": "AngularJS" }
online code點擊預覽

date

date過濾器將日期過濾成你想要的格式，這個實在是很好的過濾器。
這個過濾器用法很多我這里列舉幾種常用的
{{ today | date: "yyyy - mm - dd"}}
結果為：2015 - 15 - 13
{{ today | date: "yyyy - mm - dd HH:mm::ss"}}
結果為：2015 - 18 - 13 20:18::38
[online code](2015 - 18 - 13 20:18::38)