我有四个下拉菜单: -
<div><label>Priority:</label>
<label>First</label>
<select ng-model="a.priority[0]" ng-change="selectPriority(a.priority[0])" data-ng-options="x for x in priorityArray">
<option value="{{x}}"></option>
</select>
<label>Second</label>
<select ng-model="a.priority[1]" ng-change="selectPriority(a.priority[1])" data-ng-options="x for x in priorityArray" >
<option value="{{x}}"></option>
</select>
<label>Third</label>
<select ng-model="a.priority[2]" ng-change="selectPriority(a.priority[2])" data-ng-options="x for x in priorityArray">
<option value="{{x}}"></option>
</select>
<label>Fourth</label>
<select ng-model="a.priority[3]" ng-change="selectPriority(a.priority[3])" data-ng-options="x for x in priorityArray">
<option value="{{x}}"></option>
</select>
</div>
我想从一个下拉列表中删除所选选项,以从其他下拉菜单中删除。
我的指令代码: -
(function () {
'use strict';
angular.module('myApp.components')
.directive('product', product);
product.$inject = ['$http', '$timeout'];
function product($http, $timeout) {
return {
restrict: 'EA',
scope: {},
link: function (scope, el, attrs) {
scope.a = {};
scope.priorityArray = ["ONE","TWO","THREE","FOUR"];
$('#product').on('hide.bs.modal', function () {
scope.a = {};
});
$('#product').on('shown.bs.modal', function () {
scope.selectPriority = function (priority) {
scope.selectedPriority = [];
scope.selectedPriority.push(priority);
scope.priorityArray = _.difference(scope.priorityArray, scope.selectedPriority);
}
},
templateUrl: 'js/components/product.html'
};
}
})();
我正在使用lodash过滤器来获取其他下拉列表中的过滤数组。使用当前解决方案,所选值也会过滤原始下拉列表(我从中选择了优先级)。我希望选定的值保留在原始下拉列表中。为每个下拉列表保留不同的阵列不是一种有效的解决方案。有人可以建议我一些其他的解决方案吗?