Я создал директиву для отображения данных. Я могу включить его в ng-repeat и увидеть, что модель подключена. Когда я ухожу и возвращаюсь на страницу, данные снова отображаются с ранее внесенными изменениями. Я использовал ngResources для загрузки данных из API. Пока все хорошо: работает как положено.
Вот часть, которая ломается: если я сохраняю данные в API в своей директиве, элемент исчезает со страницы (точнее, он рисуется с пустыми полями). Остальные пункты остаются прежними. Меняется только сохраненный.
Вот директива:
.directive('action', function() {
return {
restrict: 'E',
scope: {
data:'=model'
},
templateUrl: 'modules/actions/view.tpl.html',
replace: true,
link: function(scope, element, attr) {
scope.save = function() {
console.log(" data to save:" + JSON.stringify(scope.data));
scope.data.$save();
}
}
};
})
HTML-код, связанный с директивой, включает:
<p><input type="text" ng-model="data.assignee" ng-change="save()">
Вот как использовалась директива:
<div ng-repeat="item in data">
<action model="item" />
</div>
Вот скрипка, которая показывает дополнительный контекст. Вы можете увидеть базовую директиву, работающую с некоторыми поддельными данными. Код вызова API закомментирован.
Опять же, проблема возникает, когда строка scope.data.$save(); не закомментирована. Когда элемент, отображаемый в ng-repeat, пытается сохранить себя, он исчезает из отображаемого списка элементов, заменяясь одним с пустыми полями. Когда я перезагружаю все приложение, я вижу, что сохранение API прошло успешно, и элемент теперь отображается правильно.
Я подозреваю, что происходит то, что вызов сохранения работает с правильным элементом, но каким-то образом заменяет измененный элемент новым, пустым, возможно, из-за прототипного наследования. Затем сохранение вызывает обновление родительской области, в результате чего список перерисовывается и отображается новый незаполненный элемент.
Может кто-нибудь прояснить, что происходит и как это исправить?
