Page 101 - AngularJS权威教程

10.3 绑定策略 81

JavaScript代码： 1

angular.module('myApp', [])
.directive('myDirective', function() {
return { 2
restrict: 'A',
template: 'Inside myDirective, isolate scope: {{ myProperty }}',
scope: {} 3
};
})
.directive('myInheritScopeDirective', function() {
return { 4
restrict: 'A',
template: 'Inside myDirective, isolate scope: {{ myProperty }}',
scope: true
}; 5
});
在线示例：http://jsbin.com/OxAlek/1/edit。 6

理解了最重要的关于作用域的概念后，就可以将隔离作用域中的属性同外部世界进行绑定，
使得隔离作用域可以和外部进行交互。 7

10.3 绑定策略
8

使用无数据的隔离作用域并不常见。AngularJS提供了几种方法能够将指令内部的隔离作用
域，同指令外部的作用域进行数据绑定。 9
为了让新的指令作用域可以访问当前本地作用域中的变量，需要使用下面三种别名中的一种。

本地作用域属性：使用@符号将本地作用域同DOM属性的值进行绑定。指令内部作用域可以 10
使用外部作用域的变量：
11
@ (or @attr)

现在，可以在指令中使用绑定的字符串了。
12
双向绑定：通过=可以将本地作用域上的属性同父级作用域上的属性进行双向的数据绑定。
就像普通的数据绑定一样，本地属性会反映出父数据模型中所发生的改变。
13
= (or =attr)
父级作用域绑定 通过&符号可以对父级作用域进行绑定，以便在其中运行函数。意味着对这 14
个值进行设置时会生成一个指向父级作用域的包装函数。
要使调用带有一个参数的父方法，我们需要传递一个对象，这个对象的键是参数的名称，值 15
是要传递给参数的内容。

& (or &attr) 16
例如，假设我们在开发一个电子邮件客户端，并且要创建一个电子邮件的文本输入框：
17
<input type="text" ng-model="to"/>
<!-- 调用指令 -->
<div scope-example ng-model="to"
on-send="sendMail(email)" 18
from-name="ari@fullstack.io" />