标签：
之前写过一篇了 http://www.cnblogs.com/keatkeat/p/3903673.html
但某些部分写的不太清楚，甚至有点错误，所以今天特地在这里再来谈谈。
这篇主要是说指令的隔离还有和controller的沟通.
指令的运行过程基本上我们可以简单的理解为 : template -> compile -> controller -> pre-link -> post-link
我们通常只是用到post link，但如果你的指令有嵌套，子层需要父层的一些值的话，可以考虑把这些初始值写在 controller 或者是 pre-link
pre-link 是上层到下层调用， post-link 则相反下至上调用.
在开发中当一个内容经常重复时，我们就会把它封装成指令。
这种组件的思想可以节省很多开发时间。
而封装的指令不太可能每一次使用都是一模一样的。
所以我们必须可以调整它。
一般上我们使用 attr. (就好象函数和参数的感念)
<div ng-controller="ctrl">
<dir data-param="10"></dir>
</div>
<script>
var app = angular.module("app", []);
app.directive("dir", [function () {
return {
restrict: "E",
link: function (scope, elem, attr) {
log(attr.param);
}
}
}]);
app.controller("ctrl", ["$scope", function ($scope) {
}]);
</script>
通过 attr 我们可以传入一些字符串，attr 只能传入单纯的字符串哦，不可以放属性哦
<dir data-param="someAttr"></dir> 这样是错的
<dir data-param="{{ someAttr }}"></dir> 这样是对的
有一种情况是这样，我们传入属性名，而在link函数中，我们使用 $parse(attr)(scope) 来获取到值，这是不太理想的做法，因为只能在没有隔离scope的情况下才能运行。
是否使用隔离scope, 我个人没有特别想法，只要你小心用就好了。
我个人比较喜欢用隔离的.
隔离 scope 的 "=","@","&" 的区别
隔离scope会把attr的值放入到指令的scope里头
当我们要传入一个attr时，先想清楚指令是否会对这个attr值做修改。
如果是不会那么请使用 @, 会的话用 "="
"@"的情况下，attr 传入的是字符串
<dir data-param="{{ someAttr }}"></dir> 如果想传属性
<dir data-param="string"></dir> 单纯传值
"="的情况，attr 传入的是属性名
<dir data-param="someAttr"></dir>
记住一样要是属性名，因为"="代表双向同步，里面可能改变外面，所以外面必须要有一个属性来装这个值，如果没有的话是会报错的哦！所以你一样要搞清楚这逻辑！
& 是用来传方法的。
<div ng-controller="ctrl">
<dir data-some-method="someMethod($event,someParam,insideScope)"></dir> <!--这里必须表明清楚param的名字-->
</div>
<script>
var app = angular.module("app", []);
app.directive("dir", [function () {
return {
restrict: "E",
template: ‘<div ng-click="someMethod({ $event : $event, someParam : data, insideScope : this })">click</div>‘,
link: function (scope, elem, attr) {
scope.data = "100";
scope.someMethod({ $event: "z", someParam: "gg" }); //调用是传入属性
},
scope: {
someMethod: "&"
}
}
}]);
app.controller("ctrl", ["$scope", function ($scope) {
$scope.someMethod = function ($event, someParam, insideScope) {
//这里的 this = $scope
//如果你想操作指令内的scope,可以通过param传进来
log($event);
log(someParam); //100
}
}]);
</script>
这里有点不明白的地方是，为什么必须定义好param的名字和数量呢？
如果不要使用 & , "=" 也是可以完成这个工作，"=" 可以传方法，但是 "@"不行哦 (不太理解)
如果指令内部是复杂的，那么你可能需要通过 $watch attr 来render 你的view
如果外部会修改你的 attr 值，而你的template 无法满足修改后的渲染的话。
标签：
原文地址：http://www.cnblogs.com/keatkeat/p/4523171.html
