Question

我已经在这个问题上工作了一段时间，我有一个嵌套的ng-repeat，如下所示，有两个ng-if＆＃39。

section(ng-controller="SideBarController as sidebar")
  div.sas-sidebar.navbar-default.sidebar(role="navigation")
    div.navbar-default.sidebar(role="navigation")
      div.sidebar-nav.navbar-collapse
        ul.nav.in#side-menu
          li(ng-repeat="link in links")
            a(href="#" ng-click="loadContent(link.url)" ng-if="!hasSubLink(link)") {{link.name}}
            a(href="#" ng-if="hasSubLink(link)") {{link.name}}
              span.fa.arrow(class="{{link.className}}")
              ul.nav.nav-second-level
                li(ng-repeat="sublink in link.sub")
                  a(href="#" ng-click="loadContent(sublink.url)") {{sublink.name}}
  div#page-wrapper(style="min-height: 1120px" ng-include="pageContent")

但这是我得到的回报：

<ul style="" aria-expanded="true" class="nav nav-second-level collapse in">
  <!-- ngIf: hasSubLink(link) -->
  <a class="ng-scope" href="#" ng-if="hasSubLink(link)"></a>
  <!-- end ngIf: hasSubLink(link) -->
  <!-- ngRepeat: sublink in link.sub -->
    <li class="ng-scope" ng-repeat="sublink in link.sub">
    <!-- ngIf: hasSubLink(link) -->
      <a class="ng-scope" href="#" ng-if="hasSubLink(link)"></a>
    <!-- end ngIf: hasSubLink(link) -->
      <a class="ng-binding" href="#" 

...

我的问题是：为什么ng-if在我的＆＃39;子链接＆＃39;内运行？ ng-repeat如果ng-if应该在外部范围内？

我的目标是让代码遵循这个逻辑：

loop item in set1:
    if item.question:
        print a1
    elif:
        print a2
        loop item2 in item1.subset:
           print a3

Answer 1

我最近遇到了同样的问题，到目前为止我发现的是：这种奇怪的行为是因为html 5 parsing algorythm而发生的，因为根据w3c，你不允许将互动元素嵌套在彼此内部（例如<a>内的<a>。因此，根据adoption agency algorythm，解析器在看到内部<a>时会关闭外部<a>并重新注入重新格式化的元素（说实话，我对w3c文档没有太多了解，只是主要图片，所以不要难以评判我:-)。长话短说，我已经设法通过重新格式化我的html来解决这个问题，以便<a>不会彼此嵌套。

在ng-if范围内的ng-repeat似乎运行ng-if多次

1 个答案: