2016-01-07 3 views
0

выпадающим Я использую Bootstrap DropDown, но я просто понимаю, что не делает то, что я хочуУстановите значение кнопки

<span class="dropdown" dropdown> 
    <a href="" class="btn btn-white dropdown-toggle" dropdown-toggle> 
     Click 
     <span class="caret"></span> 
    </a> 
    <ul class="dropdown-menu" dropdown-menu> 
    <li ng-repeat="data in rotations.data"> 
     {{data.name}} 
    </li> 
    </ul> 
</span> 

есть HTML я использую то, что я хочу это:

установленного начальным значение <a>, а не Click, которое является фактическим значением. Мне нужно, чтобы <a> содержал имя первого элемента в data.name, а затем это значение должно меняться в зависимости от того, какой пользователь выбирает.

здесь все, что я имею в контроллере

function RotationsCtrl (Rotations, $scope, $rootScope, $state) { 
    var vm = this; 
    vm.data = Rotations; 
    } 

что вы рекомендуете мне делать?

+0

Наверное, хорошее место для директивы здесь, где состояние выпадающего списка ca n инкапсулируется в эту директиву. Я бы посмотрел исходный код этого https://angular-ui.github.io/bootstrap/#/dropdown – BillPull

+0

@BillPull Я использую эту библиотеку, но, похоже, она делает то же самое – TheUnnamed

+0

, какая версия этой библиотеки похоже, что текущие документы имеют несколько несколько разных пространств имен? – BillPull

ответ

1

Просто установите еще одну переменную области действия и инициализировать его на контроллере первого

vm.selectedRotation = Rotations[0]; 

затем положить нг нажмите на Li тег, чтобы изменить выбранное значение

<li ng-repeat="data in rotations.data" ng-click="vm.selectedRotation = rotation;"> 
    {{data.name}} 
</li> 

и, конечно, установить эту переменную на кнопку имя

<a href="" class="btn btn-white dropdown-toggle" dropdown-toggle> 
    {{vm.selectedRotation}} 
    <span class="caret"></span> 
</a>