[英]How to auto select another option in angularjs using ng-options
我有两个选择选项,并且正在使用ng-options从json文件中获取数据。 我担心的是,如果在第一次选择中选择了一个值,我需要在另一个选择中自动选择一个对应的值。 我能够在下拉列表中填充数据。 但无法将两者连接。 请帮忙。
以下是我的首选代码:
<select ng-model="firstType"
ng-change="firstTypeChange()"
ng-options="firstValue as firstValue.value group by firstValue.group for firstValue in firstList" tabindex="1">
<option value=""></option>
</select>
第二选择如下:
<select ng-model="secondType"
ng-change="secondTypeChange()"
ng-options="secondValue as secondValue.value group by secondValue.group for secondValue in secondList"
tabindex="2">
<option value=""></option>
</select>
这是我来自控制器的代码:
$scope.firstType = "";
$scope.secondType = "";
$scope.isFirstTypeShow = true;
$scope.isSecondTypeShow = true;
$scope.firstTypeChange = function() {
$scope.formType = $scope.firstType.formType;
if ($scope.firstType.formType == 'inquiry') {
$scope.isSecondTypeShow = false;
} else if ($scope.firstType.formType != 'inquiry' || $scope.firstType.formType == null) {
$scope.isSecondTypeShow = true;
} else if ($scope.formType == 'known'){
$scope.secondType.formType = 'existing';
}
}
$scope.secondTypeChange = function() { $scope.secondFormType = $scope.secondType.formType;};
您的第二个if语句有问题
if ($scope.firstType.formType != 'inquiry' || $scope.firstType.formType == null) {
您已经从第一个if语句中知道此$ scope.firstType.formType!='inquiry'为true,这意味着此if语句始终为true,而最后一个if语句永远不会到达。
最后一个如果仍然无法使用,则需要将您的secondList中的值分配给$ scope.secondType以选择该值。 在这里查看JSFiddle
$scope.firstTypeChange = function () {
$scope.formType = $scope.firstType.value;
if ($scope.formType == 'inquiry') {
$scope.isSecondTypeShow = false;
} else if ($scope.formType == null) {
$scope.isSecondTypeShow = true;
}
else if ($scope.formType == 'known') {
$scope.secondType = $filter('filter')($scope.secondList, {value:'existing'})[0];
$scope.isSecondTypeShow = true;
}
else {
$scope.isSecondTypeShow = true;
}
}
尝试在第一个选择项上添加手表。 然后根据在第一个项目中选择的值,为第二个选择的项目设置默认值。 让我知道您是否为此使用jsfiddle示例
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.