在给定父范围的情况下获取 Angularjs 中的所有子范围答案

【问题标题】：Get to get all child scopes in Angularjs given the parent scope在给定父范围的情况下获取 Angularjs 中的所有子范围
【发布时间】：2012-09-29 01:12:20
【问题描述】：

我想知道如何获取给定父作用域的所有子作用域的列表。我可以从范围的属性中找到 $$childHead、$$childTail、$$nextSibling 和 $$prevSibling。

我现在使用的方法是从父级获取 childHead，然后使用 nextSibling 获取下一个子级，直到 nextSibling 为空。

有没有更好的方法？鉴于我想对所有孩子调用方法 [getModel]，还有更好的方法吗？

【问题讨论】：

您不应该需要访问子作用域。即使您想在父范围内发生更改时对子范围进行更改，您也不应该直接访问它们。如果你能提供一个更具体的例子来说明你想要达到的目标，你可能会得到更好的答案。
嗨@ganaraj，我使用的指令和一个指令可以以父子的方式引用另一个指令。子指令使用隔离作用域，并且在这种情况下具有自己的值，这些值对父级不可见。我想从父作用域访问这些值。
该程序的最终目标是什么？
我有许多指令，每个指令都使用隔离范围，并且有一个属性名称“模型”。给定父级，我想获取每个子级范围，然后在其上调用 getModel() 方法。我现在可以工作了。我只是对做同样事情的其他或更好的方法感兴趣。

标签： angularjs angularjs-scope parent-child enumeration

【解决方案1】：

所有 Angular 范围都附加到 DOM 元素，您可以从使用当前元素检查子元素开始，直至您想要访问的任何子元素。到达那里后，使用以下函数获取范围。

angular.element('#5th_element').scope();

【讨论】：

嗨@wajatimur，我不是在处理单个元素。我已经可以访问 rootScope 的第一个子范围，并且可以通过不断获取下一个兄弟来获取子范围。它有效，但似乎不是很“有棱角”。
是的，这是我第一次在我的项目中调整 Angular js 时的想法。但我相信这件事一定有充分的理由。
这很有趣，但我昨天重新设计了指令，没有必要访问各个范围，因为数据对象被很好地填充并且我也在使用事件。
好的，很高兴听到这个消息。很有用，请在Angular Example 上使用 JSFiddle 分享给其他朋友。
使用 angularJS 1.3 中的 debug data disabled 将无法正常工作。

【解决方案2】：

子指令使用独立的作用域，并且有它们自己的值，这些值对父指令是不可见的。我想从父作用域访问这些值。

处理“父作用域需要访问子作用域”问题的“Angular 方法”是将模型向上移动到父作用域，并让子作用域引用父属性/数据（而不是子作用域拥有自己的本地属性/副本）。例如，如果每次迭代都包含一个输入表单元素（即每次迭代需要双向数据绑定），这就是我们处理 ng-repeat 的方式：Difficulty with ng-model, ng-repeat, and inputs

使用指令，首先在父作用域中定义一个对象数组，然后让每个独立的子作用域使用“=”表示法（即双向数据绑定表示法）访问该父作用域数组（或单个对象）。因为一个对象是被共享的，独立的作用域将引用父对象（它们不会得到一个本地副本）。现在，您对子范围属性所做的任何更改实际上都会更改父范围属性。

【讨论】：

您能解释一下= 符号的确切含义吗？
@nh2，例如，假设您的 HTML 有 <div my-directive my-obj="someObj"></div>。如果您的指令指定scope: { myObj: '=' }，则父作用域和指令的隔离作用域都可以访问对象someObj。在指令中，您将在链接函数中将其称为scope.myObj。
在指令上使用隔离作用域并通过“=”引用对象的问题在于，您将只能注册自己的作用域，其他由 Angular 创建的作用域，例如 ng-repeat范围将被省略。另一种角度方法是不在指令上使用作用域（默认为从父作用域继承的作用域 true）并访问在您想知道它的子作用域的父作用域创建的 object 并继续同理
@HeberLZ 这就是我最终要做的。我建立了一个小部件工厂，我面临着沟通整个小部件的挑战。我最终在指令中默认为 always scope: true，然后在父级中使用伪全局对象使小部件可用（从对象到函数）。

【解决方案3】：

在 AngularJS 1.3.2 中，countChildScopes 方法被添加到 ngMock 模块中：

/** * @ngdoc 方法 * @name $rootScope.Scope#$countChildScopes * @module ngMock * @描述 * 计算当前作用域的所有直接和间接子作用域。 * * 当前范围不包括在内。该计数包括所有隔离子范围。 * * @returns {number} 子作用域的总数。 */ 函数 countChildScopes(范围) { // jshint 有效this: true 变量计数 = 0; // 排除当前范围 var root = 范围 || angular.element(document).injector().get('$rootScope'); var pendingChildHeads = [root.$$childHead]; 变量当前范围； while (pendingChildHeads.length) { currentScope = pendingChildHeads.shift(); 而（当前范围） { 计数 += 1; pendingChildHeads.push(currentScope.$$childHead); currentScope = currentScope.$$nextSibling; } } 返回计数； }

使用对象作为返回值来获取 ID：

函数枚举ChildScopes（范围） { // jshint 有效this: true 变量枚举 = {}; // 排除当前范围 var root = 范围 || angular.element(document).injector().get('$rootScope'); var pendingChildHeads = [root.$$childHead]; 变量当前范围； while (pendingChildHeads.length) { currentScope = pendingChildHeads.shift(); 而（当前范围） { 枚举[“范围”+pendingChildHeads.length] = currentScope.$id; pendingChildHeads.push(currentScope.$$childHead); currentScope = currentScope.$$nextSibling; } } 返回枚举； }

参考文献

【讨论】：