angularjs - 如何通过属性指令更改元素的范围？

Question

<input type='text' ng-model='foo' my-dir='customFunction' />
{{foo}}


.directive('myDir',function(){
     scope:{ customFunc : "&myDir"},
 });

现在范围将被 myDir 覆盖，并且 foo 不会在屏幕上更新。但每个具有 my-dir 属性的控件仍应在隔离范围内具有 customFunction。

可能吗？

Answer 1

正如上面评论中提到的，一个指令可能无法在所有地方都起作用。如果该指令将与其他指令(如 ng-model、ng-repeat 等)一起使用，则隔离范围可能不起作用。以下是使用 $eval 的指令示例，并且不会创建新范围:

<div ng-controller="MyCtrl">
  <input type='text' ng-model='foo' my-dir='customFunction'>
  <br>foo={{foo}}
</div>


app.directive('myDir', function() {
    return {
        link: function(scope, element, attrs) {
            scope.$eval(attrs.myDir);
        },
    }
});


function MyCtrl($scope) {
    $scope.customFunction = alert('hi');
    $scope.foo = '22';
}

Fiddle

另请参阅When writing a directive in AngularJS, how do I decide if I need no new scope, a new child scope, or a new isolated scope?