我有一个使用ng-repeat显示的名称和活动列表，该列表显示表格数据(为简洁而缩短)。列表框被填充，我可以显示之前存储了哪个SchoolDayID，如果更改下拉框中的选择，它的值就会更新。当表单加载时，它不会在下拉列表中选择任何值。对于ng-select，我尝试了几种变体，但都不起作用。我进入这个几天，不知道我做错了什么或未能理解。我如何让每一行下拉选择正确的项目?
I have try:
<select ng-model="selectedSchoolDayID" ng-init="selectedSchoolDayID = a.SchoolDayID" ng-options="x.ID as x.code for x in AMListData" >
</select>
甚至:
<select class="form-group">
<option id="selectedSchoolDay" name="selectedSchoolDay" value="{{AMListData[0].ID}}" selected="{{AMListData[0].ID}} == {{a.SchoolDayID}}">{{AMListData[0].code}}</option>
<option id="selectedSchoolDay" name="selectedSchoolDay" value="{{AMListData[1].ID}}" selected="{{AMListData[1].ID}} == {{a.SchoolDayID}}">{{AMListData[1].code}}</option>
<option id="selectedSchoolDay" name="selectedSchoolDay" value="{{AMListData[2].ID}}" selected="{{AMListData[2].ID}} == {{a.SchoolDayID}}">{{AMListData[2].code}}</option>
</select>
列表框数据:
$scope.AMListData = participationSvc.amlist();
// from participationSvc:
'amlist': function listSelectionsController($scope) {
return [
{ ID: '0', code: 'PM Programming' },
{ ID: '1', code: 'AM Programming' },
{ ID: '2', code: 'Supplemental' }
];
},
HTML/AngularJS部分:
<div ng-repeat="a in selectedAttendees | orderBy : a.LastName">
<!-- there could be many rows, once per name of person. each row should have a drop-down of its own -->
<div class="row">
<div>{{a.LastName}}</div>
...
<select class="col-md-5" id="SchoolDay" name="SchoolDay" ng-model="a.SchoolDayID">
<option data-ng-repeat="x in AMListData" name="SchoolDay" value={{x.ID}} ng-selected="{{(x.ID == selectedSchoolDay) ? true: false}}" >{{x.code}}</option>
</select>
<!-- Show me current selection and drop-down list data -->
<b> Selected ID: {{a.SchoolDayID}}</b>
<br />
<ul>
<li ng-repeat="x in AMListData">{{x.ID}} {{x.code}}</li>
</ul>
</div>
</div>
可以使用控制器的默认值
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<select ng-model="selectedSchoolDayID" ng-options="x.ID as x.code for x in AMListData" >
</select>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.a={
//SchoolDayID:'2'
};
$scope.selectedSchoolDayID=$scope.a.SchoolDayID || '1';//'1' is Default Value
$scope.AMListData=[
{ ID: '0', code: 'PM Programming' },
{ ID: '1', code: 'AM Programming' },
{ ID: '2', code: 'Supplemental' }
];
});
</script>
</body>
</html>