2015-09-29 4 views
0

В моем контроллере меню у меня есть функция сохранения меню. Переменная $ scope.menu содержит объект, который представляет мои данные меню. Функция saveMenu отправляет вызов Ajax в конечную точку REST API, а затем получает обновленное меню в ответ. Проблема в том, что когда я присваиваю $ scope.menu ответу все мои привязки данных в разрыве шаблона HTML. Вдруг все данные меню исчезают.

Контроллер код.

$scope.saveMenu = function() { 
    var menu = $scope.createJsonMenuRequest(); 
    var method = "PUT"; 
    var url = FoodUrls.foodAPI + "menus/" + menu.id; 

    var req = { 
    method: method, 
    url: url, 
    headers: { 
     "Content-Type": "application/json" 
    }, 
    data: angular.toJson(menu) 
    }; 

    $http(req).success(function(data) { 
    $scope.menu = $.extend(true, {}, data); 
    });  
}; 

Функция createJsonMenuRequest просто проходит через меню и удаляет некоторые свойства из копии, что API не нравится.

Почему привязка к шаблону HTML прерывается?

Обновлено

Перед оператором присваивания в функции успеха, то $ scope.menu выглядит примерно так.

{ 
    name: "My Menu", 
    sections: [ 
     { $$hashKey: "object:17", id: 1, name: "blarg"} 
    ] 
} 

Впоследствии это выглядит ...

{ 
    name: "My Menu", 
    sections: [ 
     { id: 1, name: "blarg-edited"} 
    ] 
} 

Он теряет $$ HASHKEYS, что Угловая ставит там, когда меню изначально создается. Не знаю, каково значение этого.

+0

Если все ваши связывающим перерыва, то наверняка у вас есть ошибка в консоли. Вы проверили, что это такое? –

+0

Вы подтвердили, что получаете требуемое значение из своего ajax requset? Вы пробовали использовать функцию увеличения углов? [https://docs.angularjs.org/api/ng/function/angular.extend](https://docs.angularjs.org/api/ng/function/angular.extend) – Erex

+0

@MatthewGreen Нет ошибок. Мое подозрение в том, что происходит, состоит в том, что когда все привязки, которые относятся к вещам, таким как menu.sections, разбиваются, когда эти menu.sections заменяются новым объектом. Объект, который ng-repeat первоначально ссылался, больше не существует. То, что я не знаю, как сделать, - заставить Angular вернуться и перестроить ссылки, используя новый объект. –

ответ

1

Я бы не рекомендовал использовать функции расширения jQuery в отношении любого свойства в угловом $ scope. $ scope - это сложный объект с большим количеством указателей на конкретные свойства и т. д. Я бы рекомендовал использовать angular.merge, так как он должен лучше выполнять слияние объектов правильно, не нарушая область действия.

https://docs.angularjs.org/api/ng/function/angular.merge

+0

lol man, просто загляните в код hes: D он уже делает $ scope.menu = $ .extend (true, {}, data); – Daredzik

+1

Daredzik, спасибо, что указал на мою опечатку. Я забыл изменить его после копирования/вставки. Это то, что я имел в виду: после другого взгляда вы делаете глубокое слияние с пустым объектом в качестве цели. Почему бы просто не сделать: 'code' $ scope.menu = data; – abiwer

+0

@abiwer Это похоже на трюк. Не уверен, что расширение jQuery закручивается, но слияние Angular не похоже на то, что на данный момент. –

0

Я еще не могу прокомментировать, поэтому я просто поставлю это здесь.

Как далеко вы отлаживали?

Я бы посмотрел на $ scope.menu перед обновлением, а затем снова в вашем методе успеха.

Как выглядят ваши данные/шаблон?

И только для моего собственного любопытства, почему глубокий $ .extend? Мог быть полностью прав, я никогда не использовал его таким образом.

Видел ваши обновления, то $ hashkey не должно быть проблемой, если вы не хотите, вы angular.copy (данные) или просто поставить трек в вашей нг-повтора:

data-ng-repeat="item in menuItems track by $index" 
+0

Я использовал расширение, потому что он делает глубокую копию объекта и возвращает его. –

Смежные вопросы