2015-01-27 2 views
11

У меня есть DropDown. Я привязываю его значение, используя ng-repeat в опции. Я хочу установить выбранное значение только с помощью поля значения.Невозможно установить выбранное значение DropDown В angularJs

Это мой код.

<div ng-controller="myCtrl"> 
    <select ng-model="selectedItemvalue"> 
     <option value="">--Select --</option> 
     <option ng-repeat="sel in selectables" value="{{sel.value}}">{{sel.label}}</option> 
    </select> 
    <p>Selected Value is : {{selectedItemvalue}}</p> 
</div> 

Js

angular.module('myApp', []) 

// controller here 
.controller('myCtrl', function($scope) { 
    $scope.selectables = [ 
     { label: 'A', value: 1}, 
     { label:'B', value: 2}, 
     { label: 'C', value: 3} 
    ]; 

    // this is the model that's used for the data binding in the select directive 
    // the default selected item 
    //using value, i want to set the selected value 
    $scope.selectedItemvalue = "2"; 
}) 

My Fiddle

Как вы можете видеть, я хочу, чтобы установить выбранное значение uisng только Устанавливая значение.

ответ

16

Для привязки к модели вам необходимо использовать ng-model вместо ng-value.

<select ng-model="selectedItemvalue"> 

Обновление:$scope.selectedItem потребности быть в контроллере $scope.selectedItemvalue, а затем вы можете использовать ng-selected, чтобы соответствовать условию на нем

рабочий пример

angular 
 
.module('myApp', []) 
 

 
// controller here 
 
.controller('myCtrl', function($scope) { 
 
    $scope.selectables = [ 
 
     { label: 'A', value: 1}, 
 
     { label:'B', value: 2}, 
 
     { label: 'C', value: 3} 
 
    ]; 
 

 
    // this is the model that's used for the data binding in the select directive 
 
    // the default selected item 
 
    //using value, i want to set the selected value 
 
    $scope.selectedItemvalue = "2"; 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script> 
 
<div ng-controller="myCtrl" ng-app="myApp"> 
 
    <select ng-model="selectedItemvalue"> 
 
     <option value="">--Select --</option> 
 
     <option ng-repeat="sel in selectables" ng-selected="selectedItemvalue == sel.value" value="{{sel.value}}">{{sel.label}}</option> 
 
    </select> 
 
<p>Selected Value is : {{selectedItemvalue}}</p> 
 
</div>

+0

См. Обновленную ссылку. Еще одна проблема –

+0

@AmitKumar см. Демо в обновленном ответе :) –

+0

Но Intially, второе Itme не выбрано в вашей демонстрации, –

4

Вы должны в основном использовать следующий синтаксис для option тега (использование ng-selected):

<option ng-repeat="sel in selectables" value="{{sel.value}}" ng-selected="sel.value == selectedItemvalue">{{sel.label}}</option> 
0

Если вы пытаетесь

$ scope.selectedItemvalue = {метка: 'B', значение: 2};

тогда это сработает.

+0

Hii. Нет. Я хочу, чтобы объект creat задал выбранное значение. Я просто хочу установить поле Value. –

+0

, тогда попробуйте как <параметр ng-repeat = "sel.value для sel в selectables" –

Смежные вопросы