代码之家 › 专栏 › 技术社区 › iJade

从“选择”下拉列表中删除空项angularjs

angularjs javascript

iJade · 技术社区 · 7 年前

代码如下:

    <html>
  <head>
  </head>
  <body ng-app="app">
    <div ng-controller="homeCtrl">
      <select ng-model="selected">
        <option ng-repeat="item in items" value="{{item.id}}">
          {{item.name}}
        </option>
      </select>
      <span>
        {{selected}}
      </span>
    </div>
  </body>
</html>

以下是JS代码:

var app = angular.module('app',[]);
            app.controller('homeCtrl',['$scope',function($scope){
                $scope.selected = 1;
                $scope.items=[
                    {name: 'harry111',id:1},
                    {name: 'rimmi',id:2}
                ];

            }]);

这是一个 DEMO

3 回复 | 直到 7 年前

Srinivas ML 7 年前

制作 $scope.selected = 1; 像 $scope.selected = "1";

var app = angular.module('app',[]);
			app.controller('homeCtrl',['$scope',function($scope){
				 $scope.selected = "1";
				$scope.items=[
					{name: 'harry111',id:1},
					{name: 'rimmi',id:2}
				];
        
       
         
       
				
			}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<html>
  <head>
  </head>
  <body ng-app="app">
    <div ng-controller="homeCtrl">
      <select ng-model="selected">
        <option ng-repeat="item in items" value="{{item.id}}">
          {{item.name}}
        </option>
      </select>
      <span>
        {{selected}}
      </span>
    </div>
  </body>
</html>

Ankit Agarwal 7 年前

你需要包括 ng-repeat <select> 像这样标记

<html>
  <head>
  </head>
  <body ng-app="app">
    <div ng-controller="homeCtrl">
      <select ng-model="selected" ng-options="value.id as value.name
                                           for (key,value) in items"
  ></select>
      <span>
        {{selected}}
      </span>
    </div>
  </body>
</html>

CODEPEN

Sajeetharan 7 年前

 ng-options="value.id as value.name for (key,value) in items"

演示

var app = angular.module('app',[]);
			app.controller('homeCtrl',['$scope',function($scope){
  		$scope.items=[
					{name: 'harry111',id:1},
					{name: 'rimmi',id:2}
				];
				   $scope.selected = $scope.items[0].id;
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<html>
  <head>
  </head>
  <body ng-app="app">
    <div ng-controller="homeCtrl">
     <select ng-model="selected" ng-options="value.id as value.name
                                           for (key,value) in items"
  ></select>
      <span>
        {{selected}}
      </span>
    </div>
  </body>
</html>