Question

所以我知道在指令中定义范围时，＆＃39; @＆＃39;表示字符串和＆＃39; =＆＃39;意味着双向绑定。什么＆＃39;＆amp;＆＃39;意思？

这是一个示例指令：

angular.module('NoteWrangler')
.directive('nwCard', function() {
  return {
    restrict: 'E',
    templateUrl: './templates/directives/nw-card.html',
    scope: {
      header: '@',
      description: '=',
      tweeted: '='
    },
    link: function(scope, element, attrs){
      if(scope.tweeted)
      element.addClass('tweeted');
    }
  };
});

Answer 1

因此&, @, =定义关系如何协同工作以确定范围隔离应该如何工作

@：文字表示

=：双向绑定=＆gt;允许您操纵数据

&：是一个操作父作用域，并传递一个值。它通常用于将父作用域函数传递给指令。

&很难在文字中解释，但这里的链接引导我完成它： https://egghead.io/lessons/angularjs-isolate-scope-expression-binding

Answer 2

简单来说，&是将function或handler传递给指令。一个好的起点是AngularJS Developer Guide。

这是一个非常基本的例子（JSFiddle）：

angular.module('Joy', [])
    .controller('MyCtrl', ['$scope', function ($scope) {
        $scope.addition = function (v1, v2) {
            console.log(v1, v2);
            return v1 + v2;
        };
}])
    .directive('passMeContrller', [function () {
    return {
        restrict: 'A',
        scope: {
            add: '&',
        },
        template: '<div>{{ add({v1: 2, v2: 4}) }}</div>'
    };
}]);

HTML是：

<div ng-app="Joy" ng-controller="MyCtrl">
    <div pass-me-contrller add="addition(v1, v2)"></div>
    <hr>
</div>

请注意，在指令模板中，函数参数应为{v1: 2, v2: 4}。它是一个对象，将由Angular解码并传递给控制器addition函数。

供参考：Pass callback function to directive

AngularJS - 自定义指令范围＆＃34;＆amp;＆＃34;做？

2 个答案: