agularjs中ng-options中的选定选项

时间:2019-03-05 10:31:02

标签: angularjs

我想在动态选择框中选择一个选项。

选择框未显示所选的任何值

$http({
                method: 'GET',
                url: $rootScope.API_URL + 'branchesShow/' + $routeParams.id,
            }).then(function successCallback(response) {
               
                $scope.city_id = response.data.data.city_id;
             
            }, function errorCallback(response) {
               // console.log(response);
            });


            $http({
                method: 'GET',
                url: $rootScope.API_URL  + 'citySelectList',
            }).then(function successCallback(response) {
              
                $scope.cities = response.data.data;
               
                console.log($scope.cities);
            }, function errorCallback(response) {
                console.log(response);
            });
  <select class = "form-control"  ng-model="city_id" ng-options="c.id as c.title for c in cities">
</select>

1 个答案:

答案 0 :(得分:0)

我认为您的$ scope.city_id不包含适当的id值,因为我可以看到您具有ng-model指令,并且如果city_id中的值与列表中对象的ID相匹配,则应选择一个选项。

检查数据中是否有错误,这里有一些片段可以帮助您:

angular.module('myApp', [])
.controller('MyCtrl', function ($scope) {

  $scope.cities = [
    {
      id: 1,
      title: 'City 1'
    },
    {
      id: 2,
      title: 'City 2'
    },
  
  ]
  
  $scope.city_id = 1;
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>

<div ng-app="myApp" ng-controller="MyCtrl">


  <select class = "form-control"  ng-model="city_id" ng-options="c.id as c.title for c in cities">
  </select>

</div>