AngularJS:NG模型对象和单个模型



我没有足够的英语来描述它,但是我认为您会从代码中理解它。基本上我的问题是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模型是不同的数据"数据"。我能得到它。我如何在选择框中获取值。

我需要获得" car_id"值。

尝试以下方法:

  • 关于下拉选项的更改,选定值将选定的值传递到函数中。
  • 使用 array.filter()方法根据汽车ID获取所选汽车的model year

演示

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>

最新更新