指令在angular项目中的应用非常频繁，当它自带的指令不能满足我们的需求时，我们就需要自定义指令；
在angular，作用域是一个很重要的概念。同样的，要定义一个指令，我们也需要设置他的sope；
angular为自定义指令提供了三种scope：①不创建独立的作用域，直接使用父作用域（false）；②创建一个继承自它的父级作用域的独立作用域（true）；③创建一个完全与外部隔离的作用域（{}）；
我们创建如下的html：
<div class="out" ng-app="app" ng-controller="appCtrl">name:{{name}}<br/><mydir></mydir></div>
1.当scope值为false时：
var app = angular.module('app', []);app.controller('appCtrl', function ($scope) {$scope.name = 'nico';})app.directive('mydir', function () {return {restrict: 'E',template: '<span>{{name}}</span>',scope: false,controller: function ($scope) {$scope.name = '2333'},link: function (scope, element, attrs, controller) {}}})
页面上的两个name都会变成“2333”，可见，当scope的值为false时，指令可以读取和修改他的父级作用域；
2.当scope的值为true时：
restrict: 'E',template: '<span>{{name}}</span>',scope: true,controller: function ($scope) {}
我们删除对name的修改：页面上显示两个“nico”；
接下来我们在指令的controller中添加对name的修改：
restrict: 'E',template: '<span>{{name}}</span>',scope: true,controller: function ($scope) {$scope.name = '2333'}
页面上第一个name显示为“nico”，第二个name显示为“2333”；
可见，当scope的值为true时，该指令的作用域是一个继承自其父作用域的单独的作用域（类似于构造函数的实例）；
3.当scope的值为{}时：
restrict: 'E',template: '<span>{{name}}</span>',scope: {},controller: function ($scope) {},link: function (scope, element, attrs, controller) {}
此时，该指令创建一个新的作用域，其中并没有name这个属性，所以页面上只会显示一个'nico';
restrict: 'E',template: '<span>{{name}}</span>',scope: {},controller: function ($scope) {$scope.name = '2333';},link: function (scope, element, attrs, controller) {}
在指令的控制器中创建该属性时，不会影响到外部作用域；页面会显示'nico和2333'；
然而，某些时候我们需要自己的作用域，又想引用或修改父作用域的某个属性，第三种情况也为我们提供了一个通道；我们可以使用前缀标识符“@”，“=”，“&”来标示指令作用域中某个属性跟父作用域的关系； "="：属性双向绑定，首先在html中标示对应关系：指令中的name对应父作用域的name；
<div class="out" ng-app="app" ng-controller="appCtrl">name:{{name}}<br/><mydir name="name"></mydir></div>
其次，在指令的scope中指定该属性的绑定方式：
scope: {name:'='}
这样子我们就完成了name属性的双向绑定，在指令作用域中可以使用和修改父作用域的name属性；
"@":属性单向绑定，其用法与"="相似，不同的是html中的标示因为是单向绑定要用{{}}；
<div class="out" ng-app="app" ng-controller="appCtrl">name:{{name}}<br/><mydir name="{{name}}"></mydir></div>——————————————————————————————————————————scope: {name:'@'}
这样子，就可以在指令中使用父作用域的属性，但是不能修改；
"&"：方法单向绑定方法；
<div class="out" ng-app="app" ng-controller="appCtrl">name:{{name}}<br/><mydir func="func()"></mydir></div>——————————————————————————————————————————scope: {func:'&'}
这样子我们在指令中就可以使用父作用域中的方法了~
如果觉得《angular自定义指令scope属性学习笔记》对你有帮助，请点赞、收藏，并留下你的观点哦！
