如何在角度js中设置选定的特定选项。记录来自DB

时间:2015-02-16 10:18:59

标签: html angularjs

我对angularJs有疑问。我想要一个下拉列表在编辑记录期间选择一个选项。我是angularJs的新手,租赁帮助我做到这一点。

HTML代码

<select class="form-control" id="txtCities" ng-model='selected' 
       ng-options="c.city_id as c.city_name for c in storesCities">
                    <option></option>
</select>

Angular js Code

$http.get('StoreCitiesData', {
                params: {
                    pageNumber: page
                }
            }).then(function(response) {
                $scope.storesCities = response.data.data;
               $scope.selected = { city_id: '410210' };
                console.log(response);
            });

Ajax响应是这样的:

{"data":[{"city_id":410115,"city_name":"Angulo"},{"city_id":410210,"city_name":"india"}

{"city_id":410220,"city_name":"pune"},{"city_id":412830,"city_name":"Delhi"}],"pages":1,"page":"1","result":"OK","message":""}

2 个答案:

答案 0 :(得分:0)

刚刚更改了以下内容

 $scope.selected=410210;

答案 1 :(得分:0)

请将这个js文件添加到html的脚本文件中,你可以在过滤器中使用它

       Underscore.js
       http://plnkr.co/edit/8B7vVgT7zU3I1VhrO82I?p=info

       $scope.selectedCityId = '410210';

       $http.get('StoreCitiesData', {
            params: {
                pageNumber: page
            }
       }).then(function(response) {
            $scope.storesCities = response.data.data;
            $scope.selected = 
                  _.filter($scope.storesCities, function (city) {
                      return city.city_id == $scope.selectedCityId;             
                  });
       });

我们可以使用angular.foreach代替过滤器

       $scope.selectedCityId = '410210';

       $http.get('StoreCitiesData', {
            params: {
                pageNumber: page
            }
       }).then(function(response) {
            $scope.storesCities = response.data.data;
            $scope.selected = 

                  angular.forEach($scope.storesCities, function(city) {
                    if(city.city_id == $scope.selectedCityId)
                    {
                      return city;
                    }
                  });

       });