twitter-bootstrap - Bootstrap 下拉列表无法在 Angular ng重复工作

  显示原文与译文双语对照的内容
0 0

我想我需要一个休息杯和茶杯。


<tr ng-repeat="participant in globalData" ng-controller="GlobalDataRowController" ng-class="rowStatus">
 <td>
 <li class="dropdown">
 <a class="dropdown-toggle">
 Click me for a dropdown, yo!
 </a>
 <ul class="dropdown-menu">
 <li ng-repeat="choice in participant.SourceDescriptions">
 <a>{{choice}}</a>
 </li>
 </ul>
 </li>
....

我有这个代码。当这个Fragment被放置在重复范围之外时,它可以正常工作。 但是在重复的时候,当我点击。

我尝试使用 angular-ui,但我不希望它只是为了这个工作。 我不认为我现在的问题是正确的。

时间: 原作者:

0 0

我一直在回想以前的问题,想把这个包起来。

我采用了在这里使用指令的方法。 它看起来不完美,但现在正在做这项工作。 所以在这个视图中。


<tr ng-repeat="participant in globalData" ng-controller="GlobalDataRowController" ng-class="rowStatus">
 <td>
 <input input-data-list-dropdown id="xx" input-class="input-xxlarge" ng-model="participant.DisplayName" options="participant.SourceDescriptions">
. . .
 </td>
</tr>

还有指令。


.directive('inputDataListDropdown', function () {
 return {
 replace: true,
 scope: { options: '=', ngModel: '=', inputClass: '=', id: '=' },
 template: '<span class="dropdown">' +
 '<a class="dropdown-toggle">'+
 '<input type="text" class="inputDataListDropdown" ng-transclude ng-model="ngModel">' +
 '</a>'+
 '<ul class="dropdown-menu no-bullets" ng-show="options && options.length> 0">' +
 '<li ng-repeat="option in options">' +
 '<a ng-click="$parent.ngModel=option">{{option}}</a>' +
 '</li>'+
 '</ul>'+
 '</span>',
 transclude: 'element',
 link: function ($scope, element, attrs) {
 $("#" + attrs.id +". inputDataListDropdown").addClass(attrs.inputClass);
 }
 };
});

原作者:
0 0

<!-- a function -->

 $scope.drop_down1 = function () {


 $scope.status = {
 isopen: false
 };

 $scope.toggled = function(open) {
 $log.log('Dropdown is now: ', open);
 };

 $scope.toggleDropdown = function($event) {
 $event.preventDefault();
 $event.stopPropagation();
 $scope.status.isopen =!$scope.status.isopen;
 };


 };

<!--create view and use ng-include-->

<div class="btn-group" dropdown is-open="status.isopen">

 <button type="button" class="btn btn-primary dropdown-toggle" ng-click="drop_down1()" dropdown-toggle ng-disabled="disabled">
 Button dropdown <span class="caret"></span>
 </button>


 <ul class="dropdown-menu" role="menu">
 <li><a href="#">Action</a></li>
 <li><a href="#">Another action</a></li>
 <li><a href="#">Something else here</a></li>
 <li class="divider"></li>
 <li><a href="#">Separated link</a></li>
 </ul>
</div>




<!-- ng-repeat example -->

<table class="table table-hover">
 <thead>
 <tr>
 <th>id</th>
 <th>vm_name</th>
 <th>date</th>
 <th>restore_type</th>
 <th>state</th>
 <th>Button</th>
 </tr>
 </thead>
 <tbody>
 <tr ng-repeat="x in data | filter:searchFilter | orderBy: 'id' :true">


 <td>{{x.id}}</td>
 <td>{{x.vm_name}}</td>
 <td>{{x.date}}</td>
 <td>{{x.restore_type}}</td>
 <td>{{x.state}}</td>

 <td>

 <div id="ctrl_10_butt" ng-include="'view/view_drop1.html'"></div>

 </td>

 </tr>
 </tbody>
 </table>

...