AngularJS привязывает переменную массива сервиса к области контроллера

Мне удалось правильно привязать объект с примитивными данными из службы к переменной области видимости из контроллера, но у меня возникли проблемы с тем, чтобы сделать то же самое с переменной массива из службы.

Служба.js

myServices.factory('MyService', ['$http', function($http) {
var mySets = [];

  return {
  initMySets: function(userId, success, error) {
    $http.get(apiUrl + "/controller/getmysets", {params:{id:userId}}).success(function (data) {
      mySets = [];
      angular.copy(data, mySets);
    }).error(error);
  },

  getMySets: mySets


}]);

Контроллеры.js

myControllers.controller('MenuController', ['$scope', 'UserService', 'MyService',
  function ($scope, UserService, MyService) {

  $scope.user = UserService.user;
  $scope.mySets = MyService.getMySets;

  $scope.logout = function() {
    UserService.logout();
  }
}]);

Индекс.html

<nav id="app-menu"  ng-controller="MenuController" ng-class="{hide:!global.showMenu,slide:global.showMenu}">
  <div id="menu-head">
    <h4>{{user.Email}}</h4>
  </div>
  <ul>
    <div ng-switch on="user.UserId != null">
      <li ng-switch-when="true"><a href="#/main" ng-click="toggleMenu();logout();">Logout</a></li>
      <li ng-switch-when="false"><a href="#/login" ng-click="toggleMenu()">Login</a></li>
      <li ng-switch-when="true" ng-repeat="mySet in mySets">
        <a href="#/mySet /{{mySet.MySetId}}" ng-click="toggleMenu()">{{mySet.Label}}</a>
      </li>
    </div>
  </ul>
</nav>

У меня есть функция login, которая вызывает initMySets при успешной передаче userId, и я знаю, что переменная mySets в службе заполняется правильно на угловой копии, но Я не получаю фактическое обновление в контроллере.

Область видимости$.пользовательская переменная обновляется из сервиса UserService, но mySet ng-repeat не отображает список из сервиса.

Данные, возвращаемые из http.get - это неисчислимая коллекция сложных объектов из моего MVC Web API controller. Я не уверен, что это имеет значение.

2 9
javascript angularjs asp.net-web-api angularjs-scope angularjs-service

2 ответа:

Привязка не работает, потому что Ваш массив (в вашем контроллере) никогда не меняется.

При вызове функции успеха initSets внутренний массив указывает на новый массив, но переменная scope по-прежнему указывает на пустой исходный массив.

Вместо того, чтобы создавать новый массив, очистите исходный массив и переместите новые элементы в исходный массив:

Заменить это:

mySets = [];
angular.copy(data, mySets);

Тем, что: 

mySets.length = 0; // Clear initial array
mySets.push.apply(mySets, data); // Push data to initial array

Смотрите эту скрипку (я моделирую асинхронный обратный вызов с использованием $ timeout) : http://jsfiddle.net/UJTPD

16

Вместо назначения нового списка (mySets = []) и последующего вызова angular.copy, вы должны просто вызывать angular.copy;

Вот так; 

angular.copy(data, mySets);
0