Pytanie Nie można ustawić wybranej wartości DropDown In angularJs


Mam DropDown. Wiążę jego wartość za pomocą ng-repeat w opcji. Chcę ustawić wybraną wartość tylko za pomocą pola wartości.

To jest Mój kod.

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

Mój Fiddle

Jak widać, chcę ustawić tylko wybraną wartość Ustanawiając wartość.


11
2018-01-27 11:39


pochodzenie




Odpowiedzi:


Musisz użyć ng-model zamiast ng-value związać go z modelem.

<select ng-model="selectedItemvalue">

Aktualizacja:  $scope.selectedItem musi być $scope.selectedItemvalue w kontrolerze, a następnie możesz użyć ng-selected aby dopasować warunek na tym

Robocza wersja demonstracyjna

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>


17
2018-01-27 11:44



Zobacz zaktualizowany link. Wciąż Ten sam problem - Amit Kumar
@AmitKumar zobacz wersję demo w zaktualizowanej odpowiedzi :) - A.B
Ale Intially, drugie Itme nie jest wybrane w twojej Demo, - Amit Kumar
chcesz, aby drugi element został wybrany początkowo? - A.B
@AmitKumar zobacz teraz odpowiedź i wersję demo - A.B


Musisz zasadniczo użyć następującej składni dla swojego option tag (użyj ng-selected):

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

4
2018-01-27 11:47





Jeśli spróbujesz

$ scope.selectedItemvalue = {label: 'B', value: 2};

to zadziała.


0
2018-01-27 11:54



Hii. Nie Chcę utworzyć obiekt, aby ustawić wybraną wartość. Po prostu chcę ustawić za pomocą pola wartości. - Amit Kumar
następnie spróbuj jako <option ng-repeat = "sel.value dla sel w selectables" - Ankit Gupta