如何使用angularJs中的lodash从其他下拉列表中删除选定的下拉列表值

时间:2017-07-26 10:04:06

标签: javascript angularjs

我有四个下拉菜单: -

<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过滤器来获取其他下拉列表中的过滤数组。使用当前解决方案,所选值也会过滤原始下拉列表(我从中选择了优先级)。我希望选定的值保留在原始下拉列表中。为每个下拉列表保留不同的阵列不是一种有效的解决方案。有人可以建议我一些其他的解决方案吗?

0 个答案:

没有答案