Question

是否有一种方法可以在传递属性扩展的情况下继承父作用域？

我想直接从模板将参数传递给可重用的指令，而不必在链接函数中更改DOM。

例如：

<form-input icon="icon-email" label="email" ng-model="data.input"></form-input>

对于这样的指令：

    <div class="form-group">
      <label>{{label}}</label>
      <div class="input-group">
        <div class="{{icon}}">@</div>
        <input class="form-control" placeholder="Email" ng-model="mail.email">
      </div>
    </div>

ng-model在父作用域中，在这种情况下控制整个表单，但我不认为有必要在控制器中存储样式属性。

有没有办法直接在模板中传递参数而不创建隔离范围？

Answer 1

您将无法'扩展'父范围。但是，您的目标可以通过使用在指令的link函数中注入的指令标记属性来完成。

所以，例如。要附加label变量，您的指令的链接函数将如下所示：

 link: function ($scope, $element, $attributes) {
         $scope.label = $scope.$eval($attributes.label);
        }

您可以查看下面的plunker进行现场演示 http://plnkr.co/edit/2qMgJSSlDyU6VwdUoYB7?p=preview

Answer 2

answer from Angad适用于静态链接，但如果链接后属性的值可能会更改，则不会更新。如果需要，sollution将把值作为字符串而不是参考值传递：

<form-input icon="icon-email" label="{{email}}" ng-model="data.input"></form-input>

在指令中，在属性上添加$ observe以更新范围变量：

$attributes.$observe('label', function(newValue){$scope.label=newValue});

现在，如果属性值发生变化，范围变量将动态变化。

AngularJS中没有隔离范围的指令范围属性

2 个答案: