Перемещение объектов между двумя массивами

Question

У меня есть два списка из массива, содержащего объекты. Я пытаюсь переместить объекты из одного списка в другой и наоборот.

Контроллер:

spApp.controller('userCtrl', 
    function userCtrl($scope,userService,groupService){ 

     //Generate list of all users on the SiteCollection 
     $scope.users = userService.getUsers(); 

      //array of objects selected through the dom 
     $scope.selectedAvailableGroups; 
     $scope.selectedAssignedGroups; 

      //array of objects the user actually belongs to 
      $scope.availableGroups; 
      $scope.assignedGroups; 

     //Generate all groups on the site 
     $scope.groups = groupService.getGroups(); 

     //Boolean used to disable add/remove buttons 
     $scope.selectedUser = false; 

      //Take the selectedAvailableGroups, add user to those groups 
      //so push objects to "assignedGroups" array and remove from "avaiableGroups" array 
     $scope.addUserToGroup = function(){ 
      userService.addUserToGroup($scope.selectedUser, $scope.selectedAvailableGroups, $scope.assignedGroups, $scope.availableGroups) 
     }; 
    } 
); 

Услуги:

spApp.factory('userService', function(){ 
var addUserToGroup = function (selectedUser, selectedAvailableGroups, assignedGroups, availableGroups) { 
    var addPromise = []; 
    var selectLength = selectedAvailableGroups.length; 

    //Add user to selected groups on server 
    for (var i = 0; i < selectLength; i++) { 
     addPromise[i] = $().SPServices({ 
     operation: "AddUserToGroup", 
     groupName: selectedAvailableGroups[i].name, 
     userLoginName: selectedUser.domain 
     });  
    }; 

    //when all users added, update dom 
    $.when.apply($,addPromise).done(function(){ 
     for (var i = 0; i < selectLength; i++) { 
     assignedGroups.push(selectedAvailableGroups[i]); 
     availableGroups.pop(selectedAvailableGroups[i]); 
     }; 
     //alert(selectedUser.name + " added to: " + JSON.stringify(selectedAvailableGroups)); 
    }); 
    } 
} 

Объект:

[{ 
id: 85, 
name: Dev, 
Description:, 
owner: 70, 
OwnerIsUser: True 
}] 

HTML:

 <div> 
      <label for="entityAvailable">Available Groups</label> 
      <select id="entityAvailable" multiple 
       ng-model="selectedAvailableGroups" 
       ng-options="g.name for g in availableGroups | orderBy:'name'"> 
      </select> 
     </div> 
     <div id="moveButtons" > 
      <button type="button" ng-disabled="!selectedUser" ng-click="addUserToGroup()">Add User</button> 
      <button type="button" ng-disabled="!selectedUser" ng-click="removeUserFromGroup()">Remove</button> 
     </div> 
     <div> 
      <label for="entityAssigned">Assigned Groups</label> 
      <select id="entityAssigned" multiple 
       ng-model="selectedAssignedGroups" 
       ng-options="g.name for g in assignedGroups | orderBy:'name'">      
      </select> 
     </div> 

Прямо сейчас, нажатие на назначенные группы работает, но только обновляется, когда я нажимаю на что-то еще или в списке, а не на самом деле динамически. Но самая большая проблема - это .pop(), который, я думаю, не работает так, как предполагалось.

Answer 1

$.when.apply($,addPromise).done(), по-видимому, не является угловым или параллельным. Так угловато не известно о ваших изменениях. Вы должны обернуть свой код внутри $scope.$apply вызова:

$scope.$apply(function(){ 
     for (var i = 0; i < selectLength; i++) { 
     assignedGroups.push(selectedAvailableGroups[i]); 
     availableGroups.pop(selectedAvailableGroups[i]); 
     }; 
}); 

Если нажать на что-то, за $ переваривать цикл будет происходить, и вы увидите изменения.

Ваш pop не работал, потому что Array.pop удаляет только последний элемент. Наверное, это не то, что ты хочешь. Если вы хотите удалить конкретный элемент, вы должны использовать Array.splice(),