Làm thế nào để gửi mục đã chọn từ menu thả xuống góc-ui lại với bộ điều khiển góc

Question

Sử dụng góc-ui, hãy xem xét những điều sau đây:

<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> 

Ứng dụng:

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" 
]; 
}]); 

Mục đích là để có được vị trí lựa chọn để thay đổi khi người dùng chọn một vị trí mới. tức là danh sách thả xuống bắt đầu như 'Vị trí: Sutton Coldfield' và nên cập nhật thành 'Vị trí: Coventry' chẳng hạn. Tôi cũng có thể muốn sử dụng giá trị trong thanh bên chẳng hạn.

Ví dụ và Plunk: http://plnkr.co/edit/5giYygkYcVDJ6RvCKRMv?p=preview

Để đạt được điều này tôi có thể cập nhật $scope.loc nhưng những gì tôi không thể hình dung ra là làm thế nào để 'dây lên' hoặc 'đẩy' lựa chọn chọn trở lại với bộ điều khiển.

Tôi cũng đang tìm cách thực hành tốt nhất để làm điều này vì tôi đang làm điều này chủ yếu cho việc học tập cá nhân của riêng tôi.

Tôi đã xem some discussion về cách sử dụng mô hình ng trên phần tử A nhưng chưa được lấy.

Answer 1

Bạn sẽ cần phải xử lý thủ công, nó chỉ là một trình đơn thả xuống nếu bạn muốn sử dụng nó như là một lựa chọn. Bạn chỉ có thể thiết lập một ng-click vào các mục lặp đi lặp lại của trình đơn thả xuống.

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

và trong điều khiển của bạn:

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

Plnkr