Kann den ausgewählten Wert von DropDown nicht einstellen In angularJs

Question

Ich habe einen DropDown. Ich verbinde es Wert mit ng-repeat auf Option. Ich möchte den ausgewählten Wert nur über das Wertfeld festlegen.

Dies ist mein Code.

<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

Wie Sie sehen können, möchte ich uisng nur ausgewählte Wert einstellen Wert Durch die Einstellung.

Answer 1

Sie müssen ng-model statt ng-value verwenden, um sie zu binden zu modellieren.

<select ng-model="selectedItemvalue"> 

Update:$scope.selectedItem Bedürfnisse $scope.selectedItemvalue in der Steuerung sein, und dann können Sie ng-selected Zustand übereinstimmen verwenden, um auf sie

Working Demo

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>

Answer 2

Sie müssen grundsätzlich die folgende Syntax für Ihre option Tag verwenden (Verwendung ng-selected):

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

Answer 3

Wenn Sie

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

dann wird es funktionieren.