5

다시 각-UI를 드롭 다운 메뉴에서 선택한 항목을 전송하는 방법, 다음 사항을 고려하십시오는 각-UI를 사용하여 각 컨트롤러

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

응용 :

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

목표는이다 사용자가 새 위치를 선택하면 선택 위치가 변경됩니다. 즉 드롭 다운은 '위치 : 서튼 콜드 필드'와 같이 시작되며 '위치 : 코번 트리'로 업데이트되어야합니다. 예를 들어 사이드 바에서 값을 사용하고 싶을 수도 있습니다.

예와 쿵하는 소리가 : http://plnkr.co/edit/5giYygkYcVDJ6RvCKRMv?p=preview

내가 $scope.loc를 업데이트 할 수 있습니다이를하지만 내가 알아낼 수 없습니다 것은하는 방법을 '선까지'또는 '푸시'컨트롤러에 다시 선택한 선택합니다.

저는 개인적 학습을 위해 주로이 작업을 수행함에있어이를 수행하는 최상의 방법을 찾고 있습니다.

A 요소에서 ng-model을 사용하는 것에 대해 some discussion을 보았지만 해결되지 않았습니다.

답변

5

수동으로 처리해야하며, 선택 항목으로 사용하려면 드롭 다운 메뉴입니다. 반복되는 드롭 다운 항목을 클릭만으로 설정할 수 있습니다.

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

및 컨트롤러에

: 위대한

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

Plnkr

+0

, 감사합니다. 하지만 수동으로 처리해야하는 몇 가지 이유 때문에 저에게 약간 우스운 냄새가납니다. 나는 아직도 그것을 배우고있어, 그래서 나는 아직 그것이 왜 냄새인지 완전히 확신하지 못한다. 맞춰 볼 때, 내 드롭 다운을