两个相同值的下降。如果用户在第一个下拉列表中选择了一个值,则必须在第二个下拉列表中禁用该值

时间:2017-07-01 09:05:06

标签: javascript html angularjs angularjs-directive ng-options

我是angularjs的新手。我在html中有两个相同值的下拉菜单。在这里,我希望每当用户在第一个下拉列表中选择一个值,然后该值想要在第二个下拉列表中禁用。

var app = angular.module('plunker', [ 'ngRoute' ]);

app.controller('queryCntrl', function($scope) {
	$scope.names = [ "Ali", "Raj", "Ahm", "Sbm", "Lvy" ];
});
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<title>Fund Transfer</title>
<link rel="stylesheet" href="style.css" type="text/css" />
<script src="lib/angular.min.js"></script>
<script src="lib/angular-route.min.js"></script>
    <script data-require="angular.js@1.2.x" src="https://code.angularjs.org/1.2.22/angular.js" data-semver="1.2.22"></script>
<script src="app.js"></script>
</head>
<body>
<div ng-controller="queryCntrl">

	From  <select ng-model="selectedName"
		ng-options="x for x in names">
	</select>
</div>
<div>
	<br> To <select ng-model="selectedName"
		ng-options="x for x in names">
	</select>
</div>
</body>
</html>

2 个答案:

答案 0 :(得分:5)

您可以使用From <select ng-model="selectedName" ng-options="name disable when (name.indexOf(selectedName1) > -1) for name in names"> </select> <br> To <select ng-model="selectedName1" ng-options="name disable when (name.indexOf(selectedName) > -1) for name in names"> </select> 表达式来禁用选项。

selectedName == name

Demo Plunker

考虑到单一选择,您可以将条件更改为$this->db->select('*')->from('games'); $this->db->where('cat_type=1'); $query = $this->db->get(); return $query->result();

答案 1 :(得分:0)

这是一种不那么混乱的方式,

update:这按预期工作

disable when中使用expression然后ng-options。我在angular.js documentation

上找到了它

这样的事,

 From  <select ng-model="selectedName"
    ng-options="x for x in names">
</select>

<br> To <select ng-model="selectedName1"
  ng-options="x disable when selectedName==x  for x in names " >
</select>

here is a working code

更新:修复了工作代码

的链接

注意:我注意到您将ng-controller放在了错误的位置,ng-controller也必须包裹第二个select字段(body是理想的位置)。