AngularJs：Ngモデルオブジェクトと単一モデルTogether

Question

私はそれを記述するのに十分な英語がありませんが、コードから理解できると思います。 基本的に私の問題は、ng-model = "" ng-options = ""一緒に使うとフォームデータが出ないということです。

<select class="form-control" name="car_id" ng-model="car_id" ng-options="I.car_brand_code as I.car_brand_name for I in CarList" ng-change="GetState()" > 
            <option value="">Select Car</option> 
           </select> 

これらの車のブランドの選択ボックス

<div class="form-group"> 
            <label class="mtb10">Model Year</label> 
            <input type="text" name="modelYear" class="form-control" ng-model="data.modelYear" placeholder="Car Year..."> 
           </div> 

これは、他のフォームオブジェクトです。 ng-modelは異なるデータ "data"です。私はそれを得ることができます。選択ボックスで値を取得する方法

私は "car_id"値を取得する必要があります。

Answer 1

これを試してみてください：ドロップダウンオプションの変更に

• はPARAMとしての機能に選択された値を渡します。
• array.filter()メソッドを使用して、車のIDに基づいて選択した車のmodel yearを取得します。あなたが持っているあなたのNG-オプション

DEMO

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('MyCtrl',function($scope) { 
 
    $scope.CarList = [ 
 
     { 
 
     "car_brand_code": 1, 
 
     "car_brand_name": "Maruti", 
 
     "model_year": 1990 
 
     }, 
 
     { 
 
     "car_brand_code": 2, 
 
     "car_brand_name": "Ford", 
 
     "model_year": 2005 
 
     } 
 
    ]; 
 
    
 
    $scope.GetState = function(carId) { 
 
     var selectedCar = $scope.CarList.filter(function(item) { 
 
     return item.car_brand_code == carId; 
 
     }); 
 
     $scope.data = { 
 
     "modelYear" : selectedCar[0].model_year 
 
     } 
 
    }; 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <select class="form-control" name="car_id" ng-model="car_id" ng-options="I.car_brand_code as I.car_brand_name for I in CarList" ng-change="GetState(car_id)" > 
 
    <option value="">Select Car</option> 
 
    </select> 
 
    <div class="form-group"> 
 
    <label class="mtb10">Model Year</label> 
 
    <input type="text" name="modelYear" class="form-control" ng-model="data.modelYear" placeholder="Car Year..."> 
 
    </div> 
 
</div>