Question

我正在创建一个Web应用程序，我从中获取数据库中的数据，

<select ng-model="ucomname" ng-init="ucomname='{{o.comname}}'" ng-change="uucomname(o)">
 <option ng-repeat="o in comnamelistfun" value="{{o.comname}}">{{o.comname}}</option>
</select>

这是我的下拉列表，但是它在顶部添加了一个空白行，但是当我获取静态数据时它工作正常，但是当我使用动态数据时，它开始在下拉列表中添加额外的空白，

注意：数据是纯动态的，并且可以正常使用静态数据

我也试过了ng-option，但仍然获得了额外的空白

Answer 1

当select ng-model未定义或ng-model引用的值不存在于一组选项中时，会发生这种情况。在这种情况下，Angular默认添加它。根据你的逻辑给出一些价值，它不会显示空白选项。

在ng-init="ucomname='{{o.comname}}'"这里我不认为o具有任何价值，因为您在ng-repeat select option内的select内创建了change $scope.ucomname = $scope.comnamelistfun[0].comname;标记本身（对于ng-repeat选项是正确的，但你不能在select上获得该变量）

编辑：

我添加了一个例子。我不知道您的确切变量，因此使用了我选择的一个，因此稍微修改了ng-option声明并删除了ng-model函数，因为我没有。但是下面的主线应该注意var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.comnamelistfun = [ {comname: 'a'}, {comname: 'b'}, {comname: 'c'} ]; $scope.ucomname = $scope.comnamelistfun[0].comname; });我们为select <!DOCTYPE html> <html> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> <body> <div ng-app="myApp" ng-controller="myCtrl"> <select ng-model="ucomname" ng-options="o.comname as o.comname for o in comnamelistfun"> </select> </body> </html>分配默认值。

＆＃13;

fork()

＆＃13;

signal

＆＃13;

Answer 2

在你的控制器中试试这个

var app = angular.module('App', []);
app.controller('Ctrl', function($scope) {
$scope.comnamelistfun = [
  {comname: 'One'},
  {comname: 'Two'},
  {comname: 'Three'}
];
 $scope.ucomname=$scope.comnamelistfun[0].comname;
});

查看

<div ng-controller="Ctrl">
<select ng-model="ucomname" ng-options="o.comname as o.comname for o in comnamelistfun">

额外的空白空间包括在angularjs的动态下拉列表中

2 个答案: