javascript - Angularjs Binding 2指令范围模型到父 Controller 模型

Question

我有一个带有 2 个对象模型的表单 Controller model1:{name:"foo"} model2:{name:"model2"}我创建了 2 个指令(都创建了独立的范围)。一个只有元素绑定(bind)，使用 model1，另一个只有属性绑定(bind)，使用 model2。

嵌套是这样的:

 <div myattibute="model2">
   <mytag my-model="model"></mytag>
 </div>

attribute only 指令没有模板，而 tag 指令有模板。

问题是我在模型的 mytag 指令中未定义。

1。有人可以看到问题并在 plnkr 中解释吗？

http://plnkr.co/edit/Q23XqY?p=preview

---

部分解决方案:添加一个空的 div 模板的工作示例只有 ng-transclude 用于 myattribute 指令使其工作。我要求这个属性指令在一个 div 上，我希望它可以放置在任何 div、span 等上。这是工作示例: http://plnkr.co/edit/z0M5ys?p=preview

2.ng-transclude如何影响作用域继承？
3.我不能只使用业务逻辑而不使用任何标记来创建此属性吗？

Answer 1

最好避免使用隔离范围，除非在极少数情况下它们会增加不必要的复杂性。仅使用 $scope.$watch 绑定(bind)到属性中的表达式要简单得多，如下所示:

$scope.$watch(attrs.myModel, function(newValue, oldValue) {})

$scope.$watch(attrs.myattribute, function(newValue, oldValue) {})

通过这种方式，您的指令可以共享它们在其中声明的父作用域并使用 $watch 表达式处理对其的绑定(bind)，或者它们可以在需要时使用 { scope: true } 创建子作用域。

这是一种可能的解决方案:http://plnkr.co/edit/mm2q67?p=preview

请记住，您的 myTag 指令可以使用隔离作用域，如果您真的想这样做的话，但是 myattribute 不能，因为那样会破坏 myTag

的作用域继承链