动态下拉菜单Angular和Bootstrap

Question

试图为按钮创建动态下拉菜单。从服务器预加载菜单作为JSON和该部分工作正常，但由于某种原因，bootstrap不显示菜单项，除了数组中的最后一个。

<div class="btn-group"> 
    <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> 
     <span class="glyphicon glyphicon-camera"></span> Select images to view <b class="caret"></b> 
    </button> 
    <ul ng-repeat="tag in tags" class="dropdown-menu"> 
     <li><a href="#" ng-click="view.setTag(tag)">{{tag}}</a></li> 
    </ul> 
</div> 

变量'tags'包含预加载数组。

在chrome和IE上尝试了相同的结果。

如果我删除从UI元素类“下拉菜单”全部项目列表将显示，如：

<Button> 
foo * 
* bar 
* baz 

对于信息：

的app.js部分填充标签变量：

this.loadTags = function() { 
     $http.get('http://localhost:5566/api/tags'). 
     success(function (data, status, headers, config) { 
      $scope.tags = data.tags; 
     }). 
     error(); 
    } 

（然而，这正常工作）

Answer 1

实测值的PR在一些实验之后的会话。将ng-repeat移动到li元素上

<div class="btn-group"> 
     <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> 
      <span class="glyphicon glyphicon-camera"></span> Select images to view <b class="caret"></b> 
     </button> 
     <ulclass="dropdown-menu"> 
      <li ng-repeat="tag in tags"><a href="#" ng-click="view.setTag(tag)">{{tag}}</a></li> 
       ^^^^^^^^^^^^^^^^^^^^^^^ 
     </ul> 
    </div>