2017-06-07 8 views
0
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
<script> 
var app = angular.module('myApp', []); 
app.controller('myctrl', function($scope) { 
    $scope.state = [{name:'TamilNadu', code:1}, {name:'Kerala', code:2}, {name:'Karnataka', code:3}]; 
    $scope.onChange = function() { 
      var a = this.drop.state; } 
}); 
</script> 
<body> 

<div ng-app="myApp" ng-controller="myctrl"> 
State : 
<select id="stat" ng-model="drop.state" ng-change="onChange()"> 
<option ng-repeat = "x in state"> {{x.name}} </option> 
<select> 
</div> 
</body> 

このコードでは、変数aのテキストボックスから選択した値を取得できます。今度は、選択した名前のコード値を取得する必要があります。 indexof()を使用することは可能ですか?そして、私は動的にそれが必要です。すなわち、 '状態'が選択されている場合、配列セットから対応する 'コード'が必要です。anglejの配列セットでindexofを使用する方法

答えて

0

あなたは、他の答えは有効ですが、これはそれについて移動する正しい方法ですoption

<option ng-repeat = "x in state" ng-value="x.code"> {{x.name}} 

デモ

var app = angular.module('myApp', []); 
 
app.controller('myctrl', function($scope) { 
 
    $scope.drop = {} 
 
    $scope.state = [{name:'TamilNadu', code:1}, {name:'Kerala', code:2}, {name:'Karnataka', code:3}]; 
 
    $scope.onChange = function() { 
 
      var a = $scope.drop.state 
 
      console.log(a) 
 
    } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myctrl"> 
 
State : 
 
<select id="stat" ng-model="drop.state" ng-change="onChange()"> 
 
<option ng-repeat = "x in state" ng-value="x.code"> {{x.name}} </option> 
 
</select> 
 
</div>

+0

{{x.name}} – Tik

+0

の状態でng-repeat = "x"を更新しました。ありがとうございました –

+0

ありがとうございました –

0

に値としてcodeを割り当てることができます:

<select id="stat" ng-model="drop.state" ng-options="x.code as x.name for x in state" ng-change="onChange()"> 
    <option value="">Select a value</option> 
</select> 

変更の目的が状態コードを取得することだった場合、この方法では必要ありません。あなたのモデルは、選択した状態コードと同じになります。

0

データを1つのプロパティにバインドして、両方にアクセスできます。好ましくはng-optionsである。それがあるべきより角度具体的には

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 
<script> 
 
    var app = angular.module('myApp', []); 
 
    app.controller('myctrl', function($scope) { 
 
    $scope.state = [{ 
 
     name: 'TamilNadu', 
 
     code: 1 
 
    }, { 
 
     name: 'Kerala', 
 
     code: 2 
 
    }, { 
 
     name: 'Karnataka', 
 
     code: 3 
 
    }]; 
 
    $scope.onChange = function() {  
 
    alert(this.drop.state.name); 
 
    alert(this.drop.state.code); 
 
    } 
 
    }); 
 
</script> 
 

 
<body> 
 

 
    <div ng-app="myApp" ng-controller="myctrl"> 
 
    State : 
 
    <select id="stat" ng-model="drop.state" ng-options= "x as x.name for x in state" ng-change="onChange()"> </select> 
 

 
</div> 
 
</body>

1
<option value="{{x}}" ng-repeat = "x in state"> {{x.name}} </option> 

あなたのオプションに値を追加する場合は、完全なオブジェクトを取得すること、およびコードにアクセスし、値

関連する問題