angular.bind使用心得
angular.bind
解釋:返回一個調(diào)用self的函數(shù)fn(self代表fn里的this).可以給fn提供參數(shù)args(*).這個功能也被稱為局部操作,以區(qū)別功能。
格式:angular.bind(self,fn,args);
self:object 對象; fn的上下文對象,在fn中可以用this調(diào)用
fn:function; 綁定的方法
args:傳入fn的參數(shù)
var obj = { name: "Any" };
var fn = function (Adj) {
console.log(this.name + "is a boy!!! And he is " + Adj + " !!!");
};
var f = angular.bind(obj, fn, "handsome");
f();//Any is a boy!!! And he is handsome!!!
var t = angular.bind(obj, fn);
t("ugly");// Any is a boy!!! And he is ugly!!!
接下來說說對angular.bind的理解吧~
bind顧名思義綁定的意思,那么假如我們要把A綁到B上,那么必須又有A和B這2個存在體。這里需要的2個存在體就一個對象和一個函數(shù)。那么怎么綁?@野獸的理解是把對象“綁”到函數(shù)的this上去執(zhí)行,這時候fn的this就等于obj了,至于第三個參數(shù),可有可無,看需求,如果函數(shù)需要傳入?yún)?shù),那么我們可以把angular.bind的第三個參數(shù)放上去,這就是傳入fn函數(shù)的參數(shù)了。
案例中第一種寫法是定義綁定的時候就把fn所需的參數(shù)傳進去了,調(diào)用的時候直接用,而案例中第二種寫法是先綁定,在調(diào)用執(zhí)行的時候再給fn傳參,效果是一樣的
對于那上面的英文句子(好吧,雖然只有2句),如果有寫錯了,那么說明深深的愛著我們的母語-中文;如果一不小心寫對了,那么請為這個裝的66666的B鼓掌~
文章最后,我們來看個實例吧
<!DOCTYPE HTML>
<html ng-app>
<head>
</head>
<script src="http://code.angularjs.org/1.2.3/angular.min.js"></script>
</body>
<script>
var self = {name:'boyi'};
//示例1--帶參數(shù)
var f = angular.bind(self, //綁定對象,作為函數(shù)的上下文
//被綁定的函數(shù)
function(age){
alert(this.name + ' is ' + age + ' !');
},
//綁定的參數(shù),可省略
'15'
);
f();//調(diào)用綁定之后的function
//示例2--不帶參數(shù)
var m = angular.bind(self, //綁定對象,作為函數(shù)的上下文
//被綁定的函數(shù)
function(age){
alert(this.name + ' is ' + age + ' !');
}
//省略參數(shù)
);
m(3);//調(diào)用傳參的函數(shù)
</script>
</body>
</html>
相關(guān)文章
詳解angularjs中如何實現(xiàn)控制器和指令之間交互
本篇文章主要介紹了詳解angularjs中如何實現(xiàn)控制器和指令之間交互,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-05-05
Angular 輸入框?qū)崿F(xiàn)自定義驗證功能
AngularJS 表單和控件可以驗證輸入的數(shù)據(jù)。本文給大家介紹Angular 輸入框?qū)崿F(xiàn)自定義驗證功能,非常不錯,具有參考借鑒價值,需要的朋友參考下2017-02-02
AngularJS中$injector、$rootScope和$scope的概念和關(guān)聯(lián)關(guān)系深入分析
這篇文章主要介紹了AngularJS中$injector、$rootScope和$scope的概念和關(guān)聯(lián)關(guān)系,結(jié)合實例形式較為深入的分析了$injector、$rootScope和$scope的概念、功能、使用方法及相互之間的關(guān)系,需要的朋友可以參考下2017-01-01
AngularJS ng-bind-template 指令詳解
本文注意介紹AngularJS ng-bind-template 指令,這里把相關(guān)資料整理了一下,并附實例代碼,有需要的小伙伴可以參考下2016-07-07

