Добавьте условие if else, чтобы закрыть и открыть элемент HTML внутри ng-repeat, используя AngularJs

Question

Я создаю динамическое меню, получая данные меню через API.успешно получил данные API и визуализировал в Html.но моя проблема в том, что у меня есть сложная структура в моем HTML.Мне нужно закрыть элемент UL после 4-го LI элемента, и я не могу этого сделать.

Я попытался поместить троичное условие в мой ng-повтор иусловие работает, но я не могу поместить элемент HTML как </ul><ul> внутри условия.

Вот мой HTML:

<nav id="topMenu">
        <ul>
            <li class="tl_dd" data-ng-repeat="headerMenu in headerMenu">
                <a href="{{headerMenu.url != ''?headerMenu.url:'javascript:;'}}" >{{headerMenu.menu_title}}</a>
                <div class="dd clear">
                    <ul>
                        <li data-ng-repeat="submenu in headerMenu.submenu">
                            <a href="{{submenu.url}}">{{submenu.title}}</a>
                         <!--Need to close ul here after every 4th li element-->
                        </li>
                    </ul>
                </div>
            </li>
        </ul>
    </nav>

Answer 1

Я думаю, вам было бы намного проще переместить ng-repeat на ul, чтобы позволить ng-repeat обрабатывать рендеринг в группах по четыре, вместо того, чтобы вручную пытаться поиграть с открывающими и закрывающими тегами html.Вы можете попробовать что-то вроде следующего:

js

  $scope.getNumber = function(data,numberOfItems) {
    if(data.length % numberOfItems === 0)
      return new Array(data.length / numberOfItems);
    else
      return new Array(Math.floor(data.length/numberOfItems) + 1);   
  }

  $scope.getData = function(data,index,numberOfItems){
    var temp = data;
    return temp.slice(index * numberOfItems,index * numberOfItems + numberOfItems);
  }

html

<div class="dd clear">
    <ul ng-repeat="item in getNumber(data,4) track by $index">
        <li data-ng-repeat="name in getData(data,$index,4)">
            {{name}}
        </li>
    </ul>
</div>

Демо