1

我有几个菜单指令，外部菜单指令里面有一些菜单项元素。底部三个（“注册”、“登录”和“个人资料”）按预期工作。上面的链接由 ng-repeat 生成，该 ng-repeat 循环遍历在其他地方设置的对象数组。当我运行代码时，我发现创建了正确数量的菜单项，但没有显示 ng-repeat 设置的属性。ng-repeat 创建的链接没有路由、图标或标签。

我不明白。我的数据看起来很好，并且嵌入的元素似乎可以访问菜单对象，因为正在输出适当数量的菜单项。

我的数据去哪儿了？

<jrt-menu data-ng-if="menu.shouldRender(authentication.user);">
        <jrt-menu-item 
            ng-repeat="item in menu.items | orderBy: 'position'" 
            label="{{item.title}}" 
            icon="{{item.icon}}" 
            route="{{item.link}}">
        </jrt-menu-item>
        <jrt-menu-item label="Sign Up" 
            route="subitem.link" 
            ng-class="{active: $uiRoute}"
            data-ng-hide="authentication.user">
        </jrt-menu-item>
        <jrt-menu-item label="Sign In" 
            route="/signin" 
            ng-class="{active: $uiRoute}"
            data-ng-hide="authentication.user">
        </jrt-menu-item>

        <jrt-menu-item label="Profile" 
            icon="fa-dashboard" 
            route="/settings/profile" 
            ng-class="{active: $uiRoute}"
            data-ng-show="authentication.user">
        </jrt-menu-item>
    </jrt-menu>

生成的 HTML：

<ul class="jrt-menu" ng-transclude="">
  <!-- ngRepeat: item in menu.items | orderBy: 'position' -->
  <jrt-menu-item ng-repeat="item in menu.items | orderBy: 'position'" label="" icon="" route="" class="ng-scope ng-isolate-scope">
    <li class="jrt-menu__item ng-binding" ng-class="{'vertical': !isVertical(), 'horizontal': !isVertical()}">
      <i class="fa  jrt-menu__icon"></i>
      <!-- ngIf: isActive() && isVertical() -->
    </li>
  </jrt-menu-item>
  <!-- end ngRepeat: item in menu.items | orderBy: 'position' -->
  <jrt-menu-item ng-repeat="item in menu.items | orderBy: 'position'" label="" icon="" route="" class="ng-scope ng-isolate-scope">
    <li class="jrt-menu__item ng-binding" ng-class="{'vertical': !isVertical(), 'horizontal': !isVertical()}">
      <i class="fa  jrt-menu__icon"></i>
      <!-- ngIf: isActive() && isVertical() -->
    </li>
  </jrt-menu-item>
  <!-- end ngRepeat: item in menu.items | orderBy: 'position' -->
  <jrt-menu-item label="Sign Up" icon="subitem.icon" route="subitem.link" ng-class="{active: $uiRoute}" data-ng-hide="authentication.user" class="ng-scope ng-isolate-scope ng-hide">
    <li class="jrt-menu__item ng-binding" ng-class="{'vertical': !isVertical(), 'horizontal': !isVertical()}">
      <i class="fa subitem.icon jrt-menu__icon"></i>Sign Up
      <!-- ngIf: isActive() && isVertical() -->
    </li>
  </jrt-menu-item>
  <jrt-menu-item label="Sign In" icon="subitem.icon" route="/signin" ng-class="{active: $uiRoute}" data-ng-hide="authentication.user" class="ng-scope ng-isolate-scope ng-hide">
    <li class="jrt-menu__item ng-binding" ng-class="{'vertical': !isVertical(), 'horizontal': !isVertical()}">
      <i class="fa subitem.icon jrt-menu__icon"></i>Sign In
      <!-- ngIf: isActive() && isVertical() -->
    </li>
  </jrt-menu-item>
  <jrt-menu-item label="Profile" icon="" route="/settings/profile" ng-class="{active: $uiRoute}" data-ng-show="authentication.user" class="ng-scope ng-isolate-scope">
    <li class="jrt-menu__item ng-binding" ng-class="{'vertical': !isVertical(), 'horizontal': !isVertical()}">
      <i class="fa  jrt-menu__icon"></i>Profile
      <!-- ngIf: isActive() && isVertical() -->
    </li>
  </jrt-menu-item>
</ul>
4

1 回答 1

0

由于您没有发布指令代码，所以很难说，但通常当我在指令中使用 ng-repeat 时，我在链接中遵循这种格式：指令的方法。

link: function(scope,element,attrs)
{
var el = angular.element(...string of text for my HTML....);
element.append(el);
$compile(el)(scope);
}

当然，您需要将 $compile 服务器添加到您的指令中。这种方法效果很好，除非您更深入地嵌套指令，在这种情况下，我会在网上搜索众多递归服务中的 1 个并将其放入我的代码中。这样新添加的元素就可以正确绑定和显示

于 2015-05-24T22:09:37.753 回答