首頁  >  文章  >  web前端  >  angular.bind使用心得_AngularJS

angular.bind使用心得_AngularJS

WBOY
WBOY原創
2016-05-16 15:35:16966瀏覽

angular.bind

解釋:傳回一個呼叫self的函數fn(self代表fn裡的this).可以給fn提供參數args(*).這個函數也被稱為局部操作,以區別函數。

格式:angular.bind(self,fn,args);

self:object  物件; fn的上下文對象,在fn中可以用this呼叫

fn:function;綁定的方法

args:傳入fn的參數

  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個存在體就一個物件和一個函數。那怎麼綁? @野獸的理解是把物件「綁」到函數的this上去執行,這時候fn的this就等於obj了,至於第三個參數,可有可無,看需求,如果函數需要傳入參數,那麼我們可以把angular.bind的第三個參數放上去,這就是傳入fn函數的參數了。

案例中第一種寫法是定義綁定的時候就把fn所需的參數傳進去了,調用的時候直接用,而案例中第二種寫法是先綁定,在調用執行的時候再給fn傳參,效果是一樣的

對於那上面的英文句子(好吧,雖然只有2句),如果有寫錯了,那麼說明深深的愛著我們的母語-中文;如果一不小心寫對了,那麼請為這個裝的666​​66的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--带参数
 var f = angular.bind(self, //绑定对象,作为函数的上下文
  //被绑定的函数
  function(age){ 
   alert(this.name + ' is ' + age + ' !');
  },
  //绑定的参数,可省略
  '15'
 );
 f();//调用绑定之后的function
  
 //示例2--不带参数
 var m = angular.bind(self, //绑定对象,作为函数的上下文
  //被绑定的函数
  function(age){ 
   alert(this.name + ' is ' + age + ' !');
  }
  //省略参数
 );
  
 m(3);//调用传参的函数		
 
</script>

</body>	
</html>

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn