2013-04-30 4 views
5

프로젝트에서 angularjs를 사용하기 시작했습니다. 여기에 퀘스트가 있습니다. 나는 아래의 HTMLAngularjs 선택 항목 선택 기본값

<div> 
<label for="lastname">Bank Name :</label> 
<select ui-select2 ng-model="bank.id"> 
    <option></option> 
    <option ng-repeat="bank in banks" value="{{bank.id}}">{{bank.text}}</option> 
</select> 
</div> 

내가 드롭 다운에 모든 은행을 반복 할 수 있습니다. 사용자가 SAVE를 선택하고 누릅니다. ID를 올바르게 가져 와서 DB에 저장했습니다. 사용자가 돌아올 때 내가 선택한 값으로 드롭 다운 값을 설정할 수 없습니다. 컨트롤러에서이 작업을 수행합니다 .js

$http.get('/AdServerLongTail/api/user'). 
success(function(data, status, headers, config) { 
    if(status == 200){ 
     $scope.id = (data["id"]);// user id     
     $scope.bank.id = (data["bankId"]);     
    } 
}). 
error(function(data, status, headers, config) { 
    alert("fail"); 
}); 

어떻게하면 XX 은행으로 설정할 수 있습니까?

답변

15

이런 식으로 ng-repeat를 사용하지 마십시오. ngOptions를 보시오. http://docs.angularjs.org/api/ng.directive:select

+2

왜? ui-select2는 ng-options에서 작동하지 않습니다. – shapeshifter

+0

들려요. 그러나 외부 라이브러리가이를 지원하지 않는다고해서 올바른 것은 아닙니다. – Lander

+4

@Lander, 나는 그것이 틀리다는데 동의하지만, 불행히도 select2를 사용하는 유일한 방법입니다. 당신은 뭔가 다른 것을 발견하거나 그것을 이와 같이 유지할 수 있습니다. 지시어 배후의 아이디어는 내부적으로 작동하는 방식을 드러내지 않고 API를 제공하기 때문에 s2에 액세스하는 더 좋은 지침을 작성하는 것이 좋습니다. 이상적인 세계에서 지시어 API는 ng-select로 작동해야합니다. ng-repeat를 사용하면 아무 것도 깨뜨리지 않으며, 해킹을 고려하지 않을 것입니다. Select2가 될 수있는 것은 각도가 매우 느립니다. –

2

내가 그것을 놓친 방법을 찾았습니다. 다음은 올바른 코드입니다.

<div> 
<label for="lastname">Bank Name :</label> 
<select ui-select2 ng-model="bank"> 
    <option></option> 
    <option ng-repeat="bank in banks" value="{{bank.id}}">{{bank.text}}</option> 
</select> 
</div> 

$http.get('/AdServerLongTail/api/user'). 
success(function(data, status, headers, config) { 
    if(status == 200){ 
     $scope.id = (data["id"]);// user id     
     $scope.bank = (data["bankId"]);     
    } 
}). 
error(function(data, status, headers, config) { 
    alert("fail"); 
}); 
+0

각도 UI없이이 작업을 수행 할 수있는 방법이 있습니까? 나는 그것에 대해서도 연구하고있다. – elliottregan

+0

옵션에서 중첩 된 반복을 사용하면 문제가 발생하고 일반적인 각도 바인딩에서는 올바르게 작동하지 않습니다. 이 기술로 인해 다른 Angular DB가 실패하는 이유를 파악하는 데 약간의 시간이 걸렸습니다 ... – taudep

+0

다른 답변을 올바르게 기재하십시오. – uriDium

8

나는 약간 새로운 것을 보았습니다. 여기에 수행하는 간단한 태그이며, 겨-선택 :

<option ng-repeat="bank in banks" value="{{bank.id}}" ng-selected="'11' == bank.id" >{{bank.text}}</option> 

그러나 다시 : 내 청춘에게 그것을 Lander에 의해 권고로이 방법을한다. 오히려 <select>ng-options을 사용하십시오. 그렇지 않으면 당신이 모델의 dropdown.assign bank.selected.id 빈 첫 번째 옵션으로 종료됩니다. (여기 사례 NG 모델에 bank.id.)

<select ng-model="bank.selected.id" ng-change="someAngularfunction()" ng-options=" (''+bank.id) as (bank.id +' - '+ bank.text) for bank in banks"> 
        <option value="">Select one</option> 
</select> 

또한 옵션 값이 은행에 표시되지 않습니다 기억 -id 옵션에서 옵션 값 = "0"또는 "1"또는 "3"을 표시합니다. 그러나 드롭 다운에서 선택한 값은 bank.selected.id 모델과 바인딩됩니다. 예를 들어 bank.id = 11 (XX Bank)처럼 드롭 다운 값이 선택되면 bank.selected.id는 "11"로 설정됩니다.