如何从angularjs中的其他选择列表中禁用选定的选项?

时间:2019-05-07 08:32:20

标签: javascript angularjs angularjs-select

我正在通过ng-repeat设置从Year和To Year的选择列表,当我从列表中选择一个选项时,我需要的工作是将其从另一个列表中禁用。如何使用Angularjs?

谢谢。

HTML

<li> 
    <select class="form-control">
        <option value="" selected disabled>From Year</option>
        <option ng-repeat="option in selectedYear" >{{option.years}}</option>
    </select>
</li>

<li>
    <select class="form-control">
        <option value="" selected disabled>To Year</option>
        <option ng-repeat="option in selectedYear" >{{option.years}}</option>
    </select>
</li>

JSON

{"json1":"[{\"years\":2018},{\"years\":2017},{\"years\":2016},{\"years\":2015}]

1 个答案:

答案 0 :(得分:0)

运行以下代码片段,让我知道,这正是您想要的

angular.module("app", [])

  .run(($rootScope) => {

    $rootScope.selectedYears = []

    $rootScope.years = [{
      "years": 2018
    }, {
      "years": 2017
    }, {
      "years": 2016
    }, {
      "years": 2015
    }]
  })
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="app">
  <li>
    <select class="form-control" ng-model="selectedYears[0]">
      <option value="" selected disabled>From Year</option>
      <option ng-repeat="option in years"
              ng-disabled="selectedYears.indexOf(option.years) !== -1 && selectedYears.indexOf(option.years) !== 0"
              ng-value="{{option.years}}">
        {{option.years}}
      </option>
    </select>
  </li>

  <li>
    <select class="form-control" ng-model=selectedYears[1]>
      <option value="" selected disabled>To Year</option>
      <option ng-repeat="option in years"
              ng-disabled="selectedYears.indexOf(option.years) !== -1 && selectedYears.indexOf(option.years) !== 1"
              ng-value="{{option.years}}">
        {{option.years}}
      </option>
    </select>
  </li>
</div>