欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

AngularJS1.x學習directive中‘&’‘=’‘@’符號的區(qū)別有哪些

這篇文章給大家分享的是有關AngularJS1.x學習directive中‘& ’‘=’ ‘@’符號的區(qū)別有哪些的內(nèi)容。小編覺得挺實用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。

為南湖等地區(qū)用戶提供了全套網(wǎng)頁設計制作服務，及南湖網(wǎng)站建設行業(yè)解決方案。主營業(yè)務為成都網(wǎng)站制作、網(wǎng)站建設、南湖網(wǎng)站設計，以傳統(tǒng)方式定制建設網(wǎng)站，并提供域名空間備案等一條龍服務，秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務。我們深信只要達到每一位用戶的要求，就會得到認可，從而選擇與我們長期合作。這樣，我們也可以走得更遠！

對組件復用這點，angular以directive的形式展示給開發(fā)者，是一個還算不錯的選擇，作為一個UI組件，必定存在數(shù)據(jù)交互。

那么數(shù)據(jù)交互過程中的幾個符號我們一定要有所了解，以及他們的區(qū)別是什么，防止我們在運用過程中出錯。

1. 首先，我們看一scope作用域下面@的使用：

html

<!doctype html> 
<html ng-app='myApp'>  
 <head>   

 </head>  
 <body>    

 <div ng-controller="listCtrl">   
  <input type="text" ng-model="t" /> 
   <test title="{{t}}" > 
    <span>我的angularjs</span> 
  </test> 
</div>  
<script type="text/javascript" src="angular.js"></script> 
<script type="text/javascript" src="main.js"></script> 
</body></html>

js

var myApp=angular.module('myApp',[]); 
myApp.controller('listCtrl',function($scope){ 
  $scope.logchore="motorola"; 
}); 


myApp.directive('test',function(){ 
  return { 
    'restrict':'E', 
    scope:{ 
      title:"@" 
    }, 
    template:'<div >{{title}}</div>' 

  } 
});

這個必須指定的，這里的title是指令里scope的@對應的，t就是控制域scope下的 .

2. = 的使用。

html

<!doctype html> 
<html ng-app='myApp'>  
 <head>   

 </head>  
 <body>    

 <div ng-controller="listCtrl">   
  <input type="text" ng-model="t" /> 
   <test title="t" > 
    <p>{{title}}</p> 
    <span>我的angularjs</span> 
  </test> 
</div>  
<script type="text/javascript" src="angular.js"></script> 
<script type="text/javascript" src="main05.js"></script> 
</body></html>

js

var myApp=angular.module('myApp',[]); 
myApp.controller('listCtrl',function($scope){ 
  $scope.logchore="motorola"; 
}); 


myApp.directive('test',function(){ 
  return { 
    'restrict':'E', 
    scope:{ 
      title:"=" 
    }, 
    template:'<div >{{title}}</div>' 

  } 
});

和上面@相比，這個直接賦值等于scope域下的t了

3. 最好我們看看&符號的使用

html

<!doctype html> 
<html ng-app='myApp'>  
 <head>   

 </head>  
 <body>    

 <div ng-controller="listCtrl">   
   <test flavor="logchore()" ></test> 
</div>  
<script type="text/javascript" src="angular.js"></script> 
<script type="text/javascript" src="main05.js"></script> 
</body></html>

js

var myApp=angular.module('myApp',[]); 
myApp.controller('listCtrl',function($scope){ 
  $scope.logchore=function(){ 
    alert('ok'); 
  }; 
}); 


myApp.directive('test',function(){ 
  return { 
    'restrict':'E', 
    scope:{ 
      flavor:"&"  
    }, 
    template:'<div ><button ng-click="flavor()"></button></div>' 

  } 
});

感謝各位的閱讀！關于“AngularJS1.x學習directive中‘& ’‘=’ ‘@’符號的區(qū)別有哪些”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！

當前題目：AngularJS1.x學習directive中‘&’‘=’‘@’符號的區(qū)別有哪些
網(wǎng)頁鏈接：http://chinadenli.net/article32/gijosc.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供搜索引擎優(yōu)化、營銷型網(wǎng)站建設、定制網(wǎng)站、移動網(wǎng)站建設、外貿(mào)網(wǎng)站建設、定制開發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)

小程序開發(fā)