ng-selected 不适用于 ng-repeat 以设置默认值
ng-selected does not work with ng-repeat to set default value
我正在尝试设置选项的默认值
我正在使用 select 和 ng-repeat。我确实在 js 文件中获取数据,我确实调用模型在那里设置值。
请查看以下代码:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-ngrepeat-select-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.2/angular.min.js"></script>
<script src="app.js"></script>
</head>
<body ng-app="ngrepeatSelect">
<div ng-controller="ExampleController">
<form name="myForm">
<label for="repeatSelect"> Repeat select: </label>
<select ng-model="datamodel">
<option ng-repeat="dataitem in data"
ng-selected ="{{dataitem == datamodel}}">{{dataitem}}</option>
</select>
</form>
<hr>
<tt>repeatSelect = {{datamodel}}</tt><br/>
</div>
</body>
</html>
app.js 文件
(function(angular) {
'use strict';
angular.module('ngrepeatSelect', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.data = [1,2,3,4,5];
$scope.datamodel = 2;
}]);
})(window.angular);
这是我的plunker
来自angular docs:
Note that the value of a select directive used without ngOptions is
always a string. When the model needs to be bound to a non-string
value, you must either explicitly convert it using a directive (see
example below) or use ngOptions to specify the set of options. This is
because an option element can only be bound to string values at
present.
因此将 $scope.datamodel = 2;
更改为 $scope.datamodel = '2';
有效。查看更新后的 plunker.
但是,最好使用 ngOptions
。同样,来自文档:
In many cases, ngRepeat can be used on <option>
elements instead of
ngOptions to achieve a similar result. However, ngOptions provides
some benefits, such as more flexibility in how the <select>
's model is
assigned via the select as part of the comprehension expression, and
additionally in reducing memory and increasing speed by not creating a
new scope for each repeated instance.
因此,为了让您的模型保持整数,您可以使用:
<select ng-model="datamodel" ng-options="dataitem for dataitem in data">
<option value="">Please Select</option>
</select>
我正在尝试设置选项的默认值 我正在使用 select 和 ng-repeat。我确实在 js 文件中获取数据,我确实调用模型在那里设置值。
请查看以下代码:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-ngrepeat-select-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.2/angular.min.js"></script>
<script src="app.js"></script>
</head>
<body ng-app="ngrepeatSelect">
<div ng-controller="ExampleController">
<form name="myForm">
<label for="repeatSelect"> Repeat select: </label>
<select ng-model="datamodel">
<option ng-repeat="dataitem in data"
ng-selected ="{{dataitem == datamodel}}">{{dataitem}}</option>
</select>
</form>
<hr>
<tt>repeatSelect = {{datamodel}}</tt><br/>
</div>
</body>
</html>
app.js 文件
(function(angular) {
'use strict';
angular.module('ngrepeatSelect', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.data = [1,2,3,4,5];
$scope.datamodel = 2;
}]);
})(window.angular);
这是我的plunker
来自angular docs:
Note that the value of a select directive used without ngOptions is always a string. When the model needs to be bound to a non-string value, you must either explicitly convert it using a directive (see example below) or use ngOptions to specify the set of options. This is because an option element can only be bound to string values at present.
因此将 $scope.datamodel = 2;
更改为 $scope.datamodel = '2';
有效。查看更新后的 plunker.
但是,最好使用 ngOptions
。同样,来自文档:
In many cases, ngRepeat can be used on
<option>
elements instead of ngOptions to achieve a similar result. However, ngOptions provides some benefits, such as more flexibility in how the<select>
's model is assigned via the select as part of the comprehension expression, and additionally in reducing memory and increasing speed by not creating a new scope for each repeated instance.
因此,为了让您的模型保持整数,您可以使用:
<select ng-model="datamodel" ng-options="dataitem for dataitem in data">
<option value="">Please Select</option>
</select>