在使用ng时，在<select>中预选<选项>
我正在使用AngularJS和HTML。 如果我的选项是使用ng-repeat生成的，是否有方法可以在选项标签中预先选择一个选项？ 例如，请参阅以下代码片段：
HTML：
<select class="form-control" id="eventSelectMenu">
<option ng-repeat="option in allEventData">{{option.name}}</option>
</select>
我尝试了这里和这里提出的解决方案，但都没有成功。
感谢您提供任何建议！
你可以设置任何应该被预选为select的ngModel值的ngModel
console.clear();
angular.module('so-answer', [])
.controller('ctrl', ['$scope',
function($scope) {
$scope.options = [1, 2, 3, 4, 5, 6];
$scope.selected = 3;
}
])<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="so-answer" ng-controller="ctrl">
<select ng-model="selected" ng-options="opt for opt in options"></select>
</div>你可以试试这个语法。 此外，您需要使用ng-model，它将为您提供您需要选择的值：
<select class="form-control"
ng-model="yourmodel"
ng-options="option for option in allEventData">
</select>
除已发布的答案之外，我还会添加这一个。 这一个演示如何使用select对象的数组。 在这种情况下，allEventData中的事件被假定为具有name和value属性。 相应地调整您的情况
angular.module("app", [])
.controller("controller", function($scope){
$scope.allEventData = [
{
value: 1,
name: "Event 1"
},
{
value: 2,
name: "Event 2"
},
{
value: 3,
name: "Event 3"
}
]
$scope.selectedEventValue = 3
})<!DOCTYPE html>
<html ng-app="app" ng-controller="controller">
<head>
<script data-require="angularjs@1.5.7" data-semver="1.5.7" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<select class="form-control" id="eventSelectMenu" ng-model="selectedEventValue" ng-options="item.value as item.name for item in allEventData">
</select>
<pre>Selected Value: {{selectedEventValue}}</pre>
</body>
</html>上一篇: Preselect <option> in <select> while using ng
下一篇: Maintain select values from dynamic drop down list after refresh