我有查看这样的代码
<div ng-repeat="location in Locations">
<ng-form name="callForm">
<div class="clearfix">
<div class="col-xs-8">
<div class="col-xs-4">
<label style="margin-top:6px;">
{{pubs.publisher}}:
</label>
</div>
<div class="col-xs-8">
<select class="form-control" ng-model="location.call_result_id">
<option ng-repeat="Result in Results" value="{{Result.id}}">{{Result.label}}</option>
</select>
</div>
</div>
</div>
</ng-form>
<br>
</div>
我的位置数组有
$scope.Locations = [
{
"id": "1",
"p_id": 22,
"publisher": "Bing",
"status_id": 12,
"notes": "",
"callback_at": "",
"call_result_id": ""
},
{
"id": "2",
"p_id": 32,
"publisher": "Local",
"status_id": 12,
"notes": "",
"callback_at": "",
"call_result_id": ""
}
]
结果数组包含
$scope.results = [
{
"id": 1,
"label": "No Answer",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
},
{
"id": 2,
"label": "Busy",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
},
{
"id": 3,
"label": "Call",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
},
{
"id": 4,
"label": "Verification",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
},
{
"id": 5,
"label": "triggered",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
},
{
"id": 6,
"label": "Issue",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
},
{
"id": 7,
"label": "Support",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
},
{
"id": 8,
"label": "null",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
}
]
现在我的问题是
当我的选择框 ng-model location.call_result_id 变为 1 时，意味着 ng-option 值 Result.id 变为 1
表示用户选择第一个选项，此时我想更新所有 ne-repeat 的选择框 ng-model 值变为 1 并且 Result.id 也变为 1
这意味着如果用户选择第一个选项，则自动将所有选择框选择为第一个选项
谁能告诉我该怎么做。
最佳答案
我希望这会有所帮助。
index.html
<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js@1.3.15" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
<script src="application.js"></script>
</head>
<body ng-app="demo" ng-controller="demoController">
<div ng-repeat="location in Locations">
<ng-form name="callForm">
<div class="clearfix">
<div class="col-xs-8">
<div class="col-xs-4">
<label style="margin-top:6px;">
{{selectedID}} {{location.publisher}}:
</label>
</div>
<div class="col-xs-8">
<select class="form-control" ng-model="call_result_id"
ng-options="r.id as r.label for r in results"
ng-change="setAllDropDowns(call_result_id)">
<option value="" disabled="">Select One</option>
</select>
</div>
</div>
</div>
</ng-form>
<br>
</div>
</body>
</html>
application.js 文件应类似于:
angular.module('demo', [])
.controller('demoController', function($scope) {
$scope.Locations = [{
"id": "1",
"p_id": 22,
"publisher": "Bing",
"status_id": 12,
"notes": "",
"callback_at": "",
"call_result_id": ""
}, {
"id": "2",
"p_id": 32,
"publisher": "Local",
"status_id": 12,
"notes": "",
"callback_at": "",
"call_result_id": ""
}, {
"id": "3",
"p_id": 32,
"publisher": "new",
"status_id": 12,
"notes": "",
"callback_at": "",
"call_result_id": ""
}];
$scope.results = [{
"id": 1,
"label": "No Answer",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
}, {
"id": 2,
"label": "Busy",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
}, {
"id": 3,
"label": "Call",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
}, {
"id": 4,
"label": "Verification",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
}, {
"id": 5,
"label": "triggered",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
}, {
"id": 6,
"label": "Issue",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
}, {
"id": 7,
"label": "Support",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
}, {
"id": 8,
"label": "null",
"created_at": "2015-04-03 11:13:47",
"updated_at": "2015-04-03 11:13:47"
}]
$scope.setAllDropDowns = function(inputId) {
$scope.call_result_id = inputId;
}
});
关于javascript - 如何根据选择的 ng-model 值更改 ng-option 值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29982844/