Question

我对ng-select有一个独特的问题。我有多个选择框填充相同的$ scope.list（这是一个重要的要求）。

这些项目只能在一系列下拉列表中选择一次。我无法实现这一点 - 因为删除$ scope.list会从上一个选择框中删除该项目。

<div ng-repeat="element in anotherList">
    <select ng-options="o for o in list" ng-model="abc" required>
 </div>

Answer 1

我最终使用ng-repeat和ng-disabled

App.js

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

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
  $scope.b  = [1, 2, 3];
  $scope.list = ["Quora", "SOf", "Wikipedia", "Google", " Wolfram Alpha"];

  $scope.isDisabled = {
    "Quora": false,
    "SOf": false,
    "Wikipedia": true,
    "Google": false,
    "Wolfram Alpha": false
  };
  $scope.updateDisabled = function(model){
    $scope.isDisabled[model] = !$scope.isDisabled[model];
  }
});

的index.html

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.17/angular.js" data-semver="1.3.17"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <div class="container" ng-repeat="a in b">
      <select class="select" 
      ng-model="abcd"
      ng-change="updateDisabled(abcd)"
      >
        <option value="">Choose unique</option>
        <option 
          ng-repeat="o in list"
          ng-disabled="isDisabled[o]"
        >{{o}}</option>

      </select>
    </div>
  </body>

</html>

Here is the plunkr

使用ng-select和更改范围

1 个答案: