AngularJS條件指令

Question

我有以下指令：

myDirective.directive('sidebar', function() { 
    return { 
    restrict: 'E', 
    replace: true, 
    template: '<li ng-repeat="m in menu"><a href="{{m.url}}"><i class="{{m.image}}"></i> {{m.name}}</a></li>', 
    link: function (scope, elem, attrs) { 
     scope.menu = [ 
     { 
      "name": "Home", 
      "url": "/", 
      "image": "fa fa-bar-chart-o" 
     }, 
     { 
      "name": "Data Integration", 
      "url": "/manage/dataintegration/index", 
      "image": "fa fa-dashboard" 
     }, 
     { 
      "name": "Users", 
      "url": "/manage/users/index", 
      "image": "fa fa-dashboard" 
     }, 
     { 
      "name": "Logger", 
      "url": "/manage/logger/index", 
      "image": "fa fa-dashboard" 
     }, 
     { 
      "name": "Drop", 
      "url": "", 
      "image": "fa fa-dashboard", 
      "submenu": [ 
      { 
       "name": "Logger", 
       "url": "/manage/logger/index", 
       "image": "fa fa-dashboard" 
      }, 
      { 
       "name": "Logger2", 
       "url": "/manage/logger/index", 
       "image": "fa fa-dashboard" 
      } 
      ] 
     } 
     ] 

    } 
    } 
}); 

是否有可能的方式，讓我知道，如果當前菜單項有一個submenu元素，因此在模板內以某種方式施加ng-if相應地更改模板？

Answer 1

在你的模板

template: '<li ng-repeat="m in menu">' + 
      '<a href="{{m.url}}"><i class="{{m.image}}"></i> {{m.name}}</a>' + 
      '<ul ng-if="m.submenu">' + 
       '<li ng-repeat="sm in m.submenu">' + 
       '<a href="{{sm.url}}"><i class="{{sm.image}}"></i> {{sm.name}}</a>' + 
       '</li>' + 
      '</ul>' + 
      '</li>', 

沒有試過以上。一些調整可能是需要的。