Angularjs 依賴壓縮及自定義過(guò)濾器寫(xiě)法
更新時(shí)間：2017年02月04日 09:48:20 作者：DaviGao
這篇文章主要介紹了Angularjs 依賴壓縮及自定義過(guò)濾器寫(xiě)法,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
具體代碼如下所示：
<!DOCTYPE html>
<html>
<body>
<header>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="angular.min.js"></script>
<script src="filter.js"></script>
</header>
<div ng-app="myApp">
<div ng-controller="firstController">
{{name | rHello}}
<br>
{{name | rHello:3:5}} // 三個(gè)參數(shù)分別是‘input 、n1、n2'
<br>
{{name | rJs}}
</div>
</div>
<script type="text/javascript">
var app=angular.module("myApp",['kk.filter']);
//kk.filter是將外部的過(guò)濾器進(jìn)行依賴注入進(jìn)行使用
app.controller('firstController',['$scope',function($s){
/*上面這行代碼是對(duì)依賴進(jìn)行壓縮， 在controller 內(nèi)使用的。firstController是控制器名稱，$scope必須是正確縮寫(xiě)不可以進(jìn)行隨意書(shū)寫(xiě)，不能壓縮。而function($s)，$s是$scope*的壓縮寫(xiě)法，隨意寫(xiě)/
$s.name="Hello Angularjs";
}]);
app.filter('rHello',function(){
return function(input,n1,n2){
console.log(input);
console.log(n1);
console.log(n2);
return input.replace(/Hello/, "你好");
}
});
</script>
</body>
</html>
//外部引入過(guò)濾器進(jìn)行使用
var appFilter=angular.module(“kk.filter”,[]);
//這里的kk.filter 是依賴名稱 可以隨便起。以及var appFilter的名字也是隨便起
appFilter.filter(‘rJs',function(){ // 過(guò)濾器名稱 隨便起
return function(input,n1,n2){
console.log(input);
console.log(n1);
console.log(n2);
return input.replace(/js/, “JavaScript”); // 這是實(shí)現(xiàn)的是將js 改為JavaScript（字符串）
}
});
以上所述是小編給大家介紹的Angularjs 依賴壓縮及自定義過(guò)濾器寫(xiě)法，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
您可能感興趣的文章:
- 詳解AngularJS中自定義過(guò)濾器
- 詳解AngularJS中$filter過(guò)濾器使用(自定義過(guò)濾器)
- AngularJS使用Filter自定義過(guò)濾器控制ng-repeat去除重復(fù)功能示例
- AngularJS 自定義過(guò)濾器詳解及實(shí)例代碼
- AngularJS自定義過(guò)濾器用法經(jīng)典實(shí)例總結(jié)
- angularJs自定義過(guò)濾器實(shí)現(xiàn)手機(jī)號(hào)信息隱藏的方法
- AngularJS實(shí)現(xiàn)的自定義過(guò)濾器簡(jiǎn)單示例
- 簡(jiǎn)述angular自定義過(guò)濾器在頁(yè)面和控制器中的使用
- Angular.Js中過(guò)濾器filter與自定義過(guò)濾器filter實(shí)例詳解
- 詳解Angular的內(nèi)置過(guò)濾器和自定義過(guò)濾器【推薦】
- angularjs自定義過(guò)濾器demo示例
相關(guān)文章
詳解angularJS+Ionic移動(dòng)端圖片上傳的解決辦法
本篇文章主要介紹了詳解angularJS+Ionic移動(dòng)端圖片上傳的解決辦法 ，具有一定的參考價(jià)值，有需要的可以了解一下2017-09-09
AngularJs Injecting Services Into Controllers詳解
本文主要介紹AngularJs Injecting Services Into Controllers的知識(shí),這里整理了一下相關(guān)資料，及示例代碼，幫助大家學(xué)習(xí)和理解，有興趣的小伙伴可以參考下2016-09-09
在Angular中使用依賴注入，可以幫助我們實(shí)現(xiàn)松耦合，可以說(shuō)只有在組件中使用依賴注入才能真正的實(shí)現(xiàn)可重用的組件。2017-06-06
Directive的概念在Angular 1.x就存在了，我對(duì)它的認(rèn)識(shí)比較模糊，所以直接通過(guò)一些例子來(lái)說(shuō)明。Angular提供的內(nèi)置執(zhí)行有很多，這次使用兩個(gè)：ngFor、ngIf。2016-08-08
Angularjs中$http以post請(qǐng)求通過(guò)消息體傳遞參數(shù)的實(shí)現(xiàn)方法
這篇文章主要介紹了Angularjs中$http以post請(qǐng)求通過(guò)消息體傳遞參數(shù)的方法,結(jié)合實(shí)例形式分析了$http使用post請(qǐng)求傳遞參數(shù)的相關(guān)設(shè)置與使用技巧,需要的朋友可以參考下2016-08-08
體驗(yàn)jQuery和AngularJS的不同點(diǎn)及AngularJS的迷人之處
AngualrJS是一個(gè)很貼心的web應(yīng)用框架，本篇通過(guò)jQuery和Angular兩種方式來(lái)實(shí)現(xiàn)同一個(gè)實(shí)例，從而體驗(yàn)兩者的不同點(diǎn)以及AngularJS的迷人之處2016-02-02
本文介紹了其在AtScript、改善依賴入駐、Annotations、路由方案等方面的改變。雖然不知道打破原有是否是件好事，不過(guò)由于不向后兼容，我們需要為遷移做好計(jì)劃2016-02-02
在Angular中,NgZone是一個(gè)服務(wù),用于管理異步任務(wù)的執(zhí)行,并提供一種在Angular區(qū)域內(nèi)或外部顯式運(yùn)行代碼的方式,NgZone.run方法是一種顯式在Angular區(qū)域內(nèi)運(yùn)行函數(shù)的方式,本文介紹Angular中的NgZone.run()有什么用,感興趣的朋友一起看看吧2024-01-01
本文主要介紹AngularJS表單的知識(shí)，這里整理了表單的基礎(chǔ)知識(shí)和簡(jiǎn)單的示例代碼，有需要的小伙伴可以參考下2016-08-08
本文主要介紹AngularJS指令,這里整理了簡(jiǎn)單的指令并附示例代碼，有需要的小伙伴可以參考下2016-08-08