这是 AngularJS 独立作用域与外界父作用域进行数据通信中最简单的一种，绑定的对象只能是父作用域中的字符串值，并且为单向只读引用，无法对父作用域中的字符串值进行修改，此外，这个字符串还必须在父作用域的 HTML 节点中以 attr（属性）的方式声明。
使用这种绑定方式时，需要在 directive 的 scope 属性中明确指定引用父作用域中的 HTML 字符串属性，否则会抛异常。示例代码如下：
实例七： 单向绑定示例
<!doctype html> <html> <head> <meta charset=utf-8"/> <title>scope nick</title> <script src="https://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> <script> angular.module('isolateScope', []) .directive("isolateDirective", function () { return { replace : true, template: '<button>{{isolates}}</button>', scope : { isolates : '@', }, link : function($scope, $element, $attr) { $scope.isolates = "DeveloperWorks";//无效 } }; }) .controller("ctrl", function ($scope) { $scope.btns = 'NICK'; }); </script> <body ng-app="isolateScope" > <div ng-controller="ctrl"> <button>{{btns}}</button> <div isolate-directive isolates="{{btns}}"></div> </div> </body> </html>
上面的代码，通过在 directive 中声明了 scope:{isolates:'@'} 使得 directive 拥有了父作用域中 data-isolates (isolates为自定义属性，不加data也可以，但建议加上data)这个 HTML 属性所拥有的值，这个值在控制器 ctrl 中被赋值为'nick'。所以，代码的运行结果是页面上有两个名为 nick的按钮。
我们还注意到 link 函数中对 isolates 进行了修改，但是最终不会在运行结果中体现。这是因为 isolates 始终绑定为父作用域中的 btns 字符串，如果父作用域中的 btns 不改变，那么在孤立作用域中无论怎么修改 isolates 都不会起作用。
通过这种形式的绑定，孤立作用域将有能力访问到父作用域中的函数对象，从而能够执行父作用域中的函数来获取某些结果。这种方式的绑定跟单向绑定一样，只能以只读的方式访问父作用函数，并且这个函数的定义必须写在父作用域 HTML 中的 attr（属性）节点上。
这种方式的绑定虽然无法修改父作用域的 attr 所设定的函数对象，但是却可以通过执行函数来改变父作用域中某些属性的值，来达到一些预期的效果。示例代码如下：
示例八：引用绑定示例
<!doctype html> <html> <head> <meta charset=utf-8"/> <title>scope nick</title> <script src="https://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> <script> angular.module('isolateScope', []) .directive("isolateDirective", function () { return { replace : true, scope : { isolates : '&', }, link : function($scope, $element, $attr) { var func = $scope.isolates(); func(); } }; }) .controller("ctrl", function ($scope) { $scope.func = function () { console.log("Nick DeveloperWorks"); } }); </script> <body ng-app="isolateScope" > <div ng-controller="ctrl"> <div isolate-directive data-isolates="func"></div> </div> </body> </html>
这个例子中，浏览器的控制台将会打印“Nick DeveloperWorks”文字。
上面的代码中我们在父作用域中指定了一个函数对象$scope.func，在孤立作用域中通过对 HTML 属性的绑定从而引用了 func。需要注意的是 link 函数中对 func 对象的使用方法，$scope.isolates 获得的仅仅是函数对象，而不是调用这个对象，因此我们需要在调用完$scope.isolates 之后再调用这个函数，才能得到真正的执行结果。
双向绑定（=或者=attr）
双向绑定赋予 AngularJS 孤立作用域与外界最为自由的双向数据通信功能。在双向绑定模式下，孤立作用域能够直接读写父作用域中的属性和数据。和以上两种孤立作用域定义数据绑定一样，双向绑定也必须在父作用域的 HTML 中设定属性节点来绑定。
双向绑定非常适用于一些子 directive 需要频繁和父作用域进行数据交互，并且数据比较复杂的场景。不过，由于可以自由的读写父作用域中的属性和对象，所以在一些多个 directive 共享父作用域数据的场景下需要小心使用，很容易引起数据上的混乱。
示例代码如下：
示例九：双向绑定示例
<!doctype html> <html> <head> <meta charset=utf-8"/> <title>scope nick</title> <script src="https://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> <script> angular.module('isolateScope', []) .directive("isolateDirective", function () { return { replace : true, template: '<button>{{isolates}}</button>', scope : { isolates : '=', }, link : function($scope, $element, $attr) { $scope.isolates.name = "NICK"; } }; }) .controller("ctrl", function ($scope) { $scope.btns = { name : 'nick', dw : 'DeveloperWorks' }; }); </script> <body ng-app="isolateScope" > <div ng-controller="ctrl"> <button>{{btns.dw}}</button> <button>{{btns.name}}</button> <div isolate-directive data-isolates="btns"></div> </div> </body> </html>
上面的代码运行的结果是浏览器页面上出现三个按钮，其中第一个按钮标题为“DeveloperWorks”，第二和第三个按钮的标题为“NICK”。