这篇文章主要介绍了angularjs指令之绑定策略（@、=、&）,AngularJS提供了几种方法能够将指令内部的隔离作用域，同指令外部的作用域进行数据绑定。
引入主题背景：angular 的指令配置中的template可以直接使用硬编码写相应的代码，不过也可以根据变量，进行动态更新。那么需要用到那些变量，因用法的不同，所以需要设置合适的绑定策略。
1：先说指令域scope的@
我觉得描述很费劲，直接用代码来阐述：
AngularJS.html
<div> //这个必须指定的，这里的title是指令里scope的@对应的，t就是控制域scope下的 <span>我的angularjs</span></div>
main05.js
var myApp=angular.module('myApp',[]); myApp.controller('listCtrl',function($scope){ $scope.logchore="motorola"; }); myApp.directive('kid',function(){ return { 'restrict':'E', scope:{ title:"@" }, template:'<div>{{title}}</div>' } });
在输入框输入数字会绑定到指令模板的title中。
2：再说说Scope的=
angularjs.html
<div> //和上面相比，这个直接赋值等于scope域下的t了 <p>{{title}}</p><span>我的angularjs</span></div>
main05.js代码如下：
var myApp=angular.module('myApp',[]); myApp.controller('listCtrl',function($scope){ $scope.logchore="motorola"; }); myApp.directive('kid',function(){ return { 'restrict':'E', scope:{ title:"=" }, template:'<div>{{title}}</div>' } });
3：最后说&，这个是用来方法调用的
angularjs.html代码如下：
<div> //先比=，函数赋值的形式，而logchore函数必须是域scope下声明的函数 </div>
main05.js代码如下：
var myApp=angular.module('myApp',[]); myApp.controller('listCtrl',function($scope){ $scope.logchore=function(){ alert('ok'); }; }); myApp.directive('kid',function(){ return { 'restrict':'E', scope:{ flavor:"&" }, template:'<div><button></button></div>' } });
如果logchore带有参数，
angularjs.html代码如下：
<div> </div>
main05.js代码如下：
var myApp=angular.module('myApp',[]); myApp.controller('listCtrl',function($scope){ $scope.logchore=function(x){ alert(x); }; }); myApp.directive('kid',function(){ return { 'restrict':'E', scope:{ flavor:"&" }, template:'<div> <button></button></div>' } });
来源gaodaimacom搞#^代%!码网以上就是angularjs指令之绑定策略（@、=、&）的详细内容，更多请关注gaodaima搞代码网其它相关文章！
搞代码网（gaodaima.com）提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接：angularjs指令之绑定策略（@、=、&）
转载请注明原文链接：angularjs指令之绑定策略（@、=、&）
