ask2

AngularJS下 select动态选项 财富值61

2016-10-10 08:40发布

站内问答 /
1520 2 4

如何实现点击下拉框动态获取下拉列表？
用chrome实现时，第一次点击不能立即出现，必须再点一次才能获取到全部列表，如下图：

正常的显示效果：

代码从apiCategory获取已有的列表信息；
从currentCategory中获取当前的Category信息，并使其显示在下拉框；
二者均为当前目录下的json格式文件；
apiCategory格式：

{   "code":"0",   "data":[     {       "category_name":"north",       "category_id":"1"     },     {       "category_name":"south",       "category_id":"2"     },     {       "category_name":"run",       "category_id":"3"     }   ] } 
<!DOCTYPE html> <html ng-app="myApp"> <head>   <meta charset="UTF-8">   <title>select demo</title> </head> <body ng-controller="ctrl"> <label for="Category">Category</label> <select  style="width: 100px" name="Category" ng-model="currentCategory" ng-click="getApiCategory()">   <option ng-repeat="cat in apiCategory" value={{cat.category_id}}>{{cat.category_name}}</option> </select> {{currentCategory}}  <script src="../lib/angular.js"></script> <script>   var myapp=angular.module("myApp",[]);   myapp.controller("ctrl",["$scope","$http",function ($scope,$http) {      $scope.getApiCategory=function () {       $http.get("currentCategory").then(function (response) {         if(response.data.code=="0")           $scope.currentCategory=response.data.data.category_id;         else           alert("Get current category failed!");       })       //若存在，不重复获取       if($scope.apiCategory)         return;       $http.get("apiCategory").then(function (response) {         if (response.data.code == "0")         {           $scope.apiCategory=[];           var  len=response.data.data.length;           for(var i=0;i<len;i++)             $scope.apiCategory.push(response.data.data[i]);           console.log($scope.apiCategory);         }         else           alert("Get apiCategory failed!");       })   }   }]) </script> </body> </html>
付费偷看设置
发送
2条回答
soukey - 这个人很懒，什么都没留下
1楼 · 2016-10-10 09:09.采纳回答

你给你的 下拉列表 来一个最小高度，因为你看你的其实是加载好了。但是因为你的高度不够出现了滚动条。

默水瓶 - 每个人都需要一个能够让他卸去伪装坦诚相待的人
2楼-- · 2016-10-10 09:04

这个问题我之前也遇到过，我说说我的想法吧。

一周热门 更多>