Angular.js $scope 和 dom 元素

Question

angular是如何追踪哪个$ scope与哪个元素相关？我有几个理论：

1. angular元素将作用域对象保存为属性
2. angular会将每个作用域保存在缓存中，并与元素建立关联
3. angular搜索每个ng-scope，神奇地找到元素

例如，我有一个带有$scope的元素，并且我想更改此元素的dom层次结构（移到外部控制器之外）。这个操作会对作用域产生什么影响？

- hamparsum limoncuyan

---

请提供更多关于您尝试做什么的具体信息。例如，如果您移动了一个在ng-repeat中的元素，Angular将不知道它，除非您也移动了数据。当前问题如果没有一些上下文是太宽泛的。这可能是一个“X-Y问题”，您应该考虑操作您的模型数据。 - charlietfl

在链接阶段，作用域继承模仿DOM层次结构。我有一个指令在ng-controller div（div a）内部，我将这个指令移动到（div b）兄弟ng-controller中。很明显，我通过改变指令位置打破了DOM层次结构。那么这个操作如何影响作用域，作用域层次结构也会根据DOM层次结构被打破。 - hamparsum limoncuyan

如果您想获得帮助，请提供一个代码示例。 - charlietfl

我正在测试AngularJS的内部功能。这里没有什么大问题。我只是想了解$scope保存在哪里，以及Angular如何理解特定的DOM与特定的$scope对象相关联。 - hamparsum limoncuyan

Answer 1

如果您有一个Angular应用程序，并且您的HTML大致如下：

<div ng-controller="OuterController">
    ...
    <div ng-controller="InnerController">
        <div id="wrapper">
            <span>An Element</span>
        </div>
    </div>
</div>

如果您将<span>移出#wrapper div，它仍然在OuterController和InnerController的上下文中。但是，如果您将其移到...所在的位置，只有OuterController的上下文适用。

每个控制器都有自己的上下文，并且该上下文递归地扩展到所有子元素，即使存在新的控制器，此时两个控制器都处于范围内。

无论使用JavaScript还是其他方式动态移动元素，这都是正确的。Angular会在内部跟踪大多数上下文。

- Aeolingamenfel

---

我会详细说明这些控制器具有不同的作用域……以防万一。 - Rorschach120

你能解释一下，$scope对象保存在哪里，以及Angular是如何理解哪个特定的作用域与特定的DOM对象相关联的吗？ - hamparsum limoncuyan