2016-05-11 11 views
-1

Ich habe n Anzahl der Auswahlen mit ng-repeat generieren und ich muss alle Optionen in den anderen Auswahlen aktualisieren, wenn ich eine der Auswahl ändern. Ich muss einen Abstimmungsmechanismus schaffen. Beispiel:Wählen Sie Updates andere wählt

Init: 
- select 1: 1,2,3,4 
- select 2: 1,2,3,4 
- select 3: 1,2,3,4 
- select 4: 1,2,3,4 

After change select 1: 
- select 1: 2 (selected) 
- select 2: 1,3,4 
- select 3: 1,3,4 
- select 4: 1,3,4 

After change select 2: 
- select 1: 2 (selected) 
- select 2: 4 
- select 3: 1,3 
- select 4: 1,3 
...etc 

Die Anzahl der wählt ist dynamisch, Optionen zeigen immer die Anzahl der erzeugten wählt

Mein Code so weit:

<div ng-model="items"> 
    <div ng-repeat="item in items"> 
     <select ng-model="selectedPollNum" ng-change="changedPoll(selectedPollNum)"> 
      <option ng-repeat="option in items">{{ $index + 1 }}</option> 
     </select> 
     <label>{{item.name}}</label> 
    </div> 
</div> 

jsFiddle: https://jsfiddle.net/gvwpgtj6/2/

Auch Optionen beginnen mit leer, und ich möchte mit dem ersten beginnen

+0

Dies scheint eher wie ein (eher breit)/Aufgabe zu tun, wie es mir unklar ist, was die * Frage * ist? Können Sie mitteilen, was Sie bisher getan haben, und sich explizit mit dem Problem Ihrer aktuellen Lösung befassen? – Jeroen

+0

Ja, tut mir leid. Also, was ich im Moment habe, ist in jsFiddle (generierte Auswahl und Optionen). Was ich erreichen möchte: Wenn ich zum Beispiel eine Nummer von der ersten Auswahl an auswähle, möchte ich die ausgewählte von allen anderen Auswahltasten entfernen ... damit ich nicht dieselbe Nummer zweimal auswählen kann. Ist das klar? – levipadre

+0

Haben Sie etwas versucht, um es zu erreichen, anstatt diese 'html'? –

Antwort

2

Ich denke, das wird deine Anforderung sein. Wenn Sie in select standardmäßig eine Option auswählen, ist es schwierig, die standardmäßig ausgewählten Optionen in anderen Dropdown-Menüs auszublenden. Es wird empfohlen, leer zu gehen.

REGLER:

function LoginController($scope) { 
 
    $scope.arr = []; 
 
    $scope.obj={}; 
 
    $scope.items = [{ 
 
    name: 'Lorem ipsum dolor sit amet' 
 
    }, { 
 
    name: 'Consectetur adipiscing elit' 
 
    }, { 
 
    name: 'Fusce faucibus turpis eget' 
 
    }, { 
 
    name: 'Sed quis nisl sed ligula' 
 
    }, { 
 
    name: 'Nunc ultricies ipsum vitae' 
 
    }]; 
 

 
    $scope.changedPoll = function(num, i) { 
 
    $scope.obj[i] = num;$scope.arr=[] 
 
    angular.forEach($scope.obj, function(value,key){ 
 
    $scope.arr.push(parseInt($scope.obj[key])) 
 
    }); 
 
    } 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app ng-controller="LoginController"> 
 
    <div ng-model="items"> 
 
    <div ng-repeat="item in items"> 
 
     <select ng-model="selectedPollNum" ng-change="changedPoll(selectedPollNum, $index)"> 
 
     <option ng-repeat="option in items" ng-show='arr.indexOf($index + 1)<0'>{{ $index + 1}}</option> 
 
     </select> 
 
     <label>{{item.name}}</label> 
 
    </div> 
 
    </div> 
 
</div>

+0

Schöne Lösung. – Matheno

+0

Das ist gut! Nett! Kannst du zu Nummer anstelle von Name wechseln? In diesem Fall 1,2,3,4,5 – levipadre

+0

Auch wenn ich eine der Optionen ändern möchte, nachdem ich ausgewählt habe, kann ich nicht tun, weil es bereits verschwunden ist. – levipadre