Question

我正在使用has-dropdown指令，我试图在topbar上生成递归的navlinks，但是我正在抛出一个错误：

Error: [$compile:multidir] Multiple directives [ngInclude, hasDropdown] asking for transclusion on: <li ng-repeat="data in pageList" ng-include="'tree.html'" ng-if="!data.node.length == 0" has-dropdown="">

这是我的用法：

      <ul class="right">
      <li ng-repeat="data in pageList" ng-include="'tree.html'" has-dropdown>
      </li>
  </ul>

<script type="text/ng-template"  id="tree.html">
   <a>[[data.name]] [[data.parent]]</a>
    <ul top-bar-dropdown>
        <li ng-repeat="data in data.node" ng-include="'tree.html'"></li>
    </ul>
</script>

我知道我不能在一个元素中使用ng-include和has-dropdown，但我需要做一些事情才能让它正常工作你能给我一个提示来理解我的问题来解决它吗？

Answer 1

以下是演示：http://plnkr.co/edit/Rxxt3ufG26PAM7GYoNOJ?p=preview 简化数据限制。

以分层方式重新排列指令可以提供帮助。所以你有秩序：

ng-repeat＆gt; ng-include＆gt;具有-下拉

 <ul class="right">
        <div ng-repeat="data in pageList" ng-include="'tree.html'">
        </div>
   </ul>

<script type="text/ng-template"  id="tree.html">
<li has-dropdown>
    <a>{{data.name}}</a>
    <ul top-bar-dropdown>
        <li ng-repeat="submenu in data.node" ng-include="'simple.html'"></li>
    </ul>
</li>
</script>

 <script type="text/ng-template"  id="simple.html">
//
 </script>

Angular-foundation多指令要求进行转换

1 个答案: