如何使用AngularJS隔离作用域中的'&'?

‘@’和'='倒是好理解，有没有一个必须使用'&'的场景?

<body ng-app="myApp" ng-init="content='abc'">
<p ng-controller="myController" >
    <input type="text" ng-model="content" />
    <div my-directive my-title="title" my-content="content" ></div>
</p>
</body>
<script type="text/javascript">
var myApp = angular.module('myApp', [])
.directive('myDirective', function($rootScope) {
    return {
        priority:1000,
        restrict: 'A',
        replace: true,
        scope: {
            myTitle:'@',
            myContent: '='
        },
        template: '<div><h2>{{myTitle}}</h2><p>from myDirective:{{myContent}}</p></div>'
    };
})  
.controller('myController',function($scope){
    $scope.content = 'from controller';
});
</script>

希望可以提供一个demo。

&的用法: 传递一个来自父scope的函数，稍后调用

什么情况下用：当我们在directive里需要调用controller的方法时，一般我们会在directive里传一些参数到controller的方法里

实际案例：比如一个树形结构的directive，我们选中某个节点后，需要在controller对这个节点进行更一步的操作，比如根据选中的节点去服务器取数据。所以在directive里面，我们需要把选中的节点传到controller里面。

Demo

Demo代码：

javascriptangular.module('docsIsoFnBindExample', [])
.controller('Controller', ['$scope', '$timeout', function($scope, $timeout) {
  $scope.name = 'Tobias';
  $scope.message = '';
  $scope.hideDialog = function (message) {
    $scope.message = message;
    $scope.dialogIsHidden = true;
    $timeout(function () {
      $scope.message = '';
      $scope.dialogIsHidden = false;
    }, 2000);
  };
}])
.directive('myDialog', function() {
  return {
    restrict: 'E',
    transclude: true,
    scope: {
      'close': '&onClose'
    },
    templateUrl: 'my-dialog-close.html'
  };
});

html<div ng-controller="Controller">
  {{message}}
  <my-dialog ng-hide="dialogIsHidden" on-close="hideDialog(message)">
    Check out the contents, {{name}}!
  </my-dialog>
</div>

my-dialog-close.html:

<div class="alert">
  <a href class="close" ng-click="close()">&times;</a>
  <div ng-transclude></div>
</div>

【热门文章】