Jak wysłać wybraną pozycję z listy rozwijanej kątowe-ui z powrotem do kątowego kontrolera

Question

Korzystanie kątową-ui, należy rozważyć następujące kwestie:

<div class="btn-group" dropdown is-open="status.isopen"> 
    <button type="button" class="btn btn-default btn-labeled dropdown-toggle fa fa-location-arrow" dropdown-toggle ng-disabled="disabled"> 
    Location: {{ loc }} <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu" role="menu"> 
    <li ng-repeat="choice in locations"> 
     <a>{{choice}}</a> 
    </li> 
    </ul> 
</div> 

Aplikacja:

var app = angular.module('Demo', ['ui.router', 'ui.bootstrap']); 

app.controller('CrmCtrl', ['$scope', function ($scope) { 
$scope.location = "Sutton Coldfield"; 
$scope.locations = [ 
    "Sutton Coldfield", 
    "Coventry", 
    "Redditch", 
    "London", 
    "Manchester", 
    "Sheffield", 
    "Dublin" 
]; 
}]); 

Celem jest uzyskać lokalizację wyboru do zmiany, gdy użytkownik wybierze nową lokalizację. tzn. menu rozwijane zaczyna się jak "Lokalizacja: Sutton Coldfield" i powinno na przykład zostać zaktualizowane do "Lokalizacja: Coventry". Mogę również chcieć na przykład użyć wartości na pasku bocznym.

Przykład i upadać: http://plnkr.co/edit/5giYygkYcVDJ6RvCKRMv?p=preview

Aby osiągnąć ten cel mogę zaktualizować $scope.loc ale czego nie mogę dowiedzieć się, jak „drut up” lub „Push” wybrany wybór z powrotem do kontrolera.

Poszukuję także metody sprawdzania najlepszych praktyk, ponieważ robię to przede wszystkim dla mojej osobistej nauki.

Widziałem some discussion o użyciu modelu ng na elemencie A, ale nie zostało ono pobrane.

Answer 1

Musisz poradzić sobie z nim ręcznie, jest to tylko rozwijane menu, jeśli chcesz go użyć jako wyboru. Możesz po prostu ustawić kliknięcie na powtarzających się elementach listy rozwijanej.

<a ng-click="setChoice(choice)">{{choice}}</a> 

w kontrolerze:

$scope.setChoice = function(data){ 
    $scope.loc = data; 
//Do somethign else.. 
} 

Plnkr