如何禁用 angularjs 中其他 select 列表中的 selected 选项?

How to disable the selected option from other select list in angularjs?

我正在通过 ng-repeat 设置一个 select 从 Year 到 Year 的列表,它工作正常我需要的是当我 select 列表中的一个选项时,它应该被禁用另一个列表。如何使用 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}]

运行 下面的片段让我知道,这正是你想要的吗

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>