Question

我想创建一个带有原型继承范围的指令（即 scope = true ），还要设置范围绑定到属性，类似于设置隔离时的跟随范围：

scope = {
'varname':'=attrname'
}

我目前的解决方案是设置 scope = true 并设置绑定到 link 函数中以下行的属性：

范围。$ watch（element.attr（＆＃39; attrname＆＃39;），function（val）{scope.varname = VAL; }）; //观看更改scope.varname = 范围$的eval（element.attr（＆＃39; attrname＆＃39））。; //初始化

虽然这样做但它看起来并不优雅。你建议采用什么方法？

我发现令人惊讶的是，angularjs似乎期望在一个指令中，在设置一个新的继承范围时你不需要属性绑定。

Answer 1

我知道你的意思，我同意你的意见。如果Angular为指令设置一个方便的框架来设置父作用域变量和子作用域变量之间的双向模型绑定并且仍然支持原型作用域继承，那将是很好的。

为了达到与隔离范围相同的效果：

 scope = {'varname':'=attrname'}

您可以在指令的链接功能中设置双向模型绑定：

scope: true,
link:  function(scope, element, attr) {
     // when attrname changes in parent scope, update varname in current scope
     scope.$parent.$watch(attr.attrname, function(newVal) {
          scope.varname = newVal;
     });

     // when varname changes in current scope, update attrname in parent scope
     scope.$watch('varname', function(newVal) { 
          scope.$parent[attr.attrname] = newVal;
     });
}

Answer 2

我认为您正在寻找的是指令链接功能中的代码：

 var yourVar = $parse(attrs.attrName)(scope);  // Parse the attribute with a specific scope context

然后，您将像使用隔离范围指令一样传递属性，同时仍然可以使用原型继承的范围。

如果您发现自己想要观察变量的变化，那么我认为您应该使用隔离范围而不是继承。通过观察下面建议的属性更改仍然可行，但我不认为这是最佳做法。（我没有太多支持这种说法，只有直觉，所以选择你认为最好的一切）

如果你想知道$ parse是如何工作的，你可以在这里找到更多信息： https://docs.angularjs.org/api/ng/service/ $解析

如果您还需要一名傻瓜，或者如果您掌握了它，请在评论中告诉我。

Answer 3

鉴于您想要实现的目标，我认为您的解决方案完全有效。如果您使用$scope.$observe()代替$scope.$watch()：

，您仍然可以改进代码

scope.$observe('attrname', function(val) {
    scope.varname = $parse(val)(scope);
});

绑定到原型继承范围中的属性

3 个答案: