在编译中断的角度转换ng-repeat

Question

我试图创建一个可以将两个东西转换成不同位置的指令，其中一个是ng-repeat，但是在我的编译函数中使用$transclude会在返回{{1}时中断但是，如果我在undefined is not a function中执行此功能，但pre-compile没有内容。

我的代码看起来像这样

ng-repeat

我还尝试过手动转换，返回空ng-repeat

 .directive('sidebarItem', ['_', function(_) {
    return {
      replace: true,
      transclude: true,
      scope: {
        title: '@',
        state: '@',
        activeState: '=',
        dropdown: '='
      },
      compile: function(ele, attrs, transclude) {
        transclude(ele) // This returns error
        return {
          pre: function(scope, ele,attrs, ctrl, trns) {
            trns(scope) // This has my transcluded content but the ng-repeat is empty
          }
        }
      }
    }
  }

侧边栏项目模板

trns(scope.$parent, function(tEle, tScope) {
  var repeat = tEle[1].querySelector('[repeat]'),
  newEle = angular.element('<li ng-repeat="item in studentDropdown"></li>'),
 dropdown = ele[0].querySelector('.dropdown')

  tScope.studentDropdown // Can access here
  newEle.append(repeat.innerHTML)
  angular.injector(['ng']).get('$compile')(newEle) // returns ng-repeat comment but no items
  angular.element(dropdown).append(newEle)
})

使用指令

li.sidebar-item(ng-class='{active: active, dropdown: dropdown, "dropdown-open": isDropdownOpen}')
  .sidebar-content
    a.sidebar-item-link(ng-if='!dropdown' ui-sref='{{state}}')
    a.sidebar-item-link(ng-if='dropdown' ng-click='toggleDropdown()')
    .icon(ng-transclude)

    .title {{ title }}

    .down-arrow(ng-if='dropdown')

  ul.dropdown(ng-if='dropdown')

替代使用

sidebar-item
  div(has-dropdown)
    div(icon)
      //icon stuff
    div(dropdown)
      li(ng-repeat='item in dropdown')
        | {{ item }}