孤立的范围与简单的angularjs嵌套指令

Please check this plnkr

我已经阅读过，可以找到指令，范围和隔离范围。但是我仍然无法理解使这项工作的方式。

我创建的指令只要不嵌套在另一个指令中，就完美地工作。

当嵌套时，’localFunc：“& func”’属性绑定到外部控制器范围，但’localAttr：’= attr“’范围失败。

我会非常感激任何人可以帮助我理解为什么。

在图形上，这里是您的范围看起来像我们键入任何一个文本框：

请注意，隔离范围006的父级是由指令容器创建的转发范围。因此，范围006中的searchText将被数据化到范围005(而不是范围003)，因为正在使用原语。

如果我们在第一个文本框中输入11，并将第二个文本框22插入第二个文本框，再次检查范围，我们可以看到数据绑定发生在哪里：

searchforThis2在范围005中为黄色，表示已创建新属性。这是因为使用了原语 – 范围005在这里不使用原型继承，它只是在自身上创建一个新的基元属性(即它不会在属性名称的范围003中查找)。其他黄色项目表示原始值已更改。

如您已经发现的，此问题的“最佳实践”解决方案是在父范围(即范围003)中绑定到对象属性(而不是基元)。

在控制器中使用以下内容：

$scope.obj = {searchforThis1: "Sample Text 1",searchforThis2: "Sample Text 2"};

并在您的HTML中：

<search searchtext="obj.searchforThis1"...>
...
<div container>
  <search searchtext="obj.searchforThis2"...>

现在的作用域如下所示：

如果我们在第一个文本框中输入11，并将第二个文本框22插入第二个文本框，再次检查范围，我们可以看到数据绑定发生在哪里：

因为范围006是一个隔离范围，它使用其$ parent来获得范围005(如上所述)。然而，从那里开始，原型继承正在发挥作用，因为我们不使用原语。对象属性searchforThis2位于范围003。

原文地址：https://www.jb51.cc/angularjs/144073.html