Angular：如果在ng-init中设置变量'存储'在哪里？

Question

这个ng-init变量'someData'到底存储在哪里？

<tr data-ng-repeat="item in items" ng-init="someData=1"> 
<td>{{item.id}}</td> 
<td>{{someData}}</td> 
</tr> 

如何从外部访问它，即从应该设置someData = someData + 1的函数访问它？

Answer 1

视图中定义的变量的当前范围限定。然而，知道你现在的范围实际上并不总是那么容易。您当前的范围由创建范围的最接近的元素决定。

简单的情况下

如果你是直接在控制器内，然后你目前的范围是控制器的$范围变量。如下面的例子：

在HTML

<div ng-controller="MyController"> 
    <div ng-init="someData = 1"> 
    </div> 
</div> 

在myController的

$timeout(function() { 
    console.log($scope.someData); // Logs 1 
}) 

变量 “someData” 被上的myController的范围所限定。请注意超时，因为在解析视图之前之前运行控制器，所以如果我们立即登录，ng-init将不会运行，并且变量未定义。

如果你要窝两个控制器，然后就NG-INIT里面，它将会分配给最接近的一个。所以，如果你有控制器A和里面，你有控制器B和你NG-INIT里面，那么它将会分配控制器B里面的变量，而不是A.

越少simpel情况下

如果你尝试上述解决方案与您的代码是行不通的。原因是你正在使用中继器。 ng-repeat，以及大多数其他指令将创建他们自己的范围！在你的情况下someData将被定义在中继器的内部范围内，这是你的控制器无法访问的！这是顺便说一句，重复中的“item”变量存储在该行的本地中继器范围中。转发器中的每一行都会得到它自己的新范围，这就是为什么每行都使用相同的“项目”变量，但每次都意味着不同的事情。

<div ng-controller="MyController"> 
    We are now in the scope of MyController. 
    Variables defined here can be find in $scope of MyController. 

    <div ng-repeat="foo in bar"> 
     We are now in the local repeater scope, one for each row. 
     Note that the containing div is part of the scope. 
     Variables defined here go on the local scope, MyController can't find them. 
    </div> 

    The repeater scope has ended, we are back in MyController 

    <div ng-include="someview.html"> 
     And now we are in the local scope of the ng-include! 
     This scope works just like the ng-repeat one does. 
    </div> 
</div> 

这与JavaScript中继承的工作方式有关。请注意，如果你从哪里得到，只有在家长存在的变量（比如将它打印出来），它会正常工作。在JavaScript中，当你得到一个变量时，它会继续继承链，直到它找到它。瓦努阿图只要你尝试分配值的东西它会创建它自己的局部变量，并从那时起使用该代替。

所以你的情况，你无法真正从控制器找到它（除非你送了它作为参数传递给过程的函数），因为父作用域不能访问儿童范围。

更好的方法

有一些方法可以解决这个问题。推荐的方法是使用控制器作为语法。它在documentation for ng-controller中进行了描述，但总而言之，您将变量直接分配给控制器对象（而不是$ scope对象），然后在您的视图中调用控制器时为其命名。这可以让你清楚你从哪个控制器获得哪个变量。

在myController的

this.data = {}; 

在HTML

<div ng-controller="MyController as MC"> 
    <div ng-controller="item in items" ng-init="MC.someData = 1"> 
    </div> 
</div> 

既然你现在明确创建someData你的 “MC” 控制器上没有更多的混乱。无论有多少指令或控制器嵌套，你都知道数据到底在哪里。请注意，“item”仍然在中继器范围内，但这没关系，因为它应该在中继器内部。如果你需要它，可以使用一个函数将它传出，或者理论上在你的中继器中使用ng-init。