如果用户选择“文本框值-空”,则文本框应禁用并清除文本框。我正在使用下面的代码来做到这一点。但不幸的是我做不到。 如果用户输入值并选择“text-box-value-empty”,则文本框应清除。
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.myList = [{
text: "1",
value: "option_1"
}, {
text: "2",
value: "option_2"
},];
$scope.sizes = "D,text-box-value-empty,";
$scope.number = function() {
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<!DOCTYPE html>
<html lang="en-US">
<script src="angular.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<div>
<div ng-repeat="a in myList">
<select ng-model="selectedOption" ng-options="choice as choice for (idx, choice) in sizes.split(',')" ng-change="number()">
</select>
<input type="text" ng-model="myval"/>
</div>
</div>
</div>
</body>
</html>
最佳答案
首先,将selectedOption
和myVal
设置为空对象
$scope.myval = {}
$scope.selectedOption = {};
然后使用 $index
将 ng-model 指定为每个变量的属性。另外,使用ng-disabled
禁用输入
<div ng-repeat="a in myList">
<select ng-model="selectedOption[$index]" ng-options="choice as choice for (idx, choice) in sizes.split(',')" ng-change="number($index)">
</select>
<input ng-disabled="selectedOption[$index] == 'text-box-value-empty'" type="text" ng-model="myval[$index]"/>
</div>
然后将index
传递给number
函数并将值设为空
演示
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.myList = [{
text: "1",
value: "option_1"
}, {
text: "2",
value: "option_2"
}, ];
$scope.myval = {}
$scope.selectedOption = {};
$scope.sizes = "D,text-box-value-empty,";
$scope.number = function(index) {
if ($scope.selectedOption[index] == 'text-box-value-empty') {
$scope.myval[index] = ''
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<!DOCTYPE html>
<html lang="en-US">
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<div>
<div ng-repeat="a in myList">
<select ng-model="selectedOption[$index]" ng-options="choice as choice for (idx, choice) in sizes.split(',')" ng-change="number($index)">
</select>
<input ng-disabled="selectedOption[$index] == 'text-box-value-empty'" type="text" ng-model="myval[$index]"/>
</div>
</div>
</div>
</body>
</html>
关于javascript - 下拉更改时 Angular js文本框值为空,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47546243/