Question

可能有人比我更有经验向我解释为什么这会编译：

    <li class="btn dropdown top-stack breadcrumb-btn" ng-repeat="nodeName in selectedNodeNames">
        <a class="dropdown-toggle btn-anchor">{{nodeName}}</a>
        <ul class="dropdown-menu">
            <li ng-class="activeState($parent.$index,$index)" ng-repeat="node in selectedNodeAtLevel($index).children">
                <a ng-click="tabSelect($parent.$index,$index)">{{getIndexString(node)}}</a>
            </li>
        </ul>
    </li>

这里面的ng-repeat不是吗？

    <li class="btn dropdown top-stack breadcrumb-btn" ng-repeat="nodeName in selectedNodeNames">
        <a class="dropdown-toggle btn-anchor">{{nodeName}}</a>
        <ul class="dropdown-menu">
            <li ng-class="activeState($parent.$index,$index)" ng-repeat="node in selectedNodeAtLevel($parent.$index).children">
                <a ng-click="tabSelect($parent.$index,$index)">{{getIndexString(node)}}</a>
            </li>
        </ul>
    </li>

请注意，我使用$ parent。$ index调用selectedNodeAtLevel（）函数，而不仅仅是$ index。为什么它会为一个而不是另一个编译？我能做些什么来达到同样的效果？

（通过“编译”我的意思是它不生成任何HTML，只是有问题的行的注释副本）

感谢您的耐心等待！

Answer 1

首先我要指出ng-repeat创造了新的范围。另外，我假设外部重复不在另一个重复内部。假设您在第一个示例中注意到您将$index传递给selectedNodeAtLevel函数。这是有效的，因为$index由外部重复定义，并在外部重复范围的上下文中进行解析。此$index变量对应于每个nodeName。

所以第二个例子失败了，因为外部重复$index中没有定义$parent（实际上是指这个代码所在的控制器的范围）。

至少在第二种情况下，您似乎期望$index引用内部重复，但它不引用，它指的是已定义范围中定义的$index。因此，即使在activeState的第一个示例中，您也应该遇到问题，因为$parent.$index引用了该问题。请注意，从内部重复内部引用$index将引用该内部范围的$index。

AngularJS内部ng-repeat不处理函数参数中的$ index。$ parent

1 个答案: