Как я могу добавить свои задачи обратно в мой список, используя Restangular
Так что вот поток, который я хотел бы запросить мудрый, начальная загрузка страницы -> получить задачи -> добавить задачу. добавить задачу, не должна требовать последующей выборки созданной задачи или списка.
вот соответствующая часть моего app.js до сих пор
.config(function (RestangularProvider) {
RestangularProvider.setBaseUrl('http://localhost:8080');
RestangularProvider.addResponseInterceptor(function halInterceptor(data, operation, what) {
var resp;
if (operation === 'getList') {
if (typeof data._embedded !== 'undefined') {
resp = data._embedded[what];
resp.page = data.page;
return resp;
}
else {
return [];
}
}
return data;
});
})
вот мой контроллер
'use strict';
angular.module('myTaskApp')
.controller('Task', function ($scope, Restangular) {
var tasks = Restangular.all('task');
if ( typeof $scope.tasks === 'undefined' ) {
$scope.tasks = tasks.getList().$object;
}
$scope.add = function add() {
tasks.post($scope.task).then(function () {
console.log('add task: ', $scope.task);
// MAGIC HERE
});
};
})
;
Вот заголовки ответа для создания
HTTP/1.1 201 Created
Server: Apache-Coyote/1.1
Access-Control-Allow-Origin: *
Access-Control-Allow-: POST, GET, PUT, OPTIONS, DELETE
Access-Control-Allow-Headers: content-type, x-requested-with
Access-Control-Max-Age: 3600
Location: http://localhost:8080/task/5c75235d-d9f7-4cdd-98b4-3487603d8fcb
Content-Length: 0
Date: Sat, 20 Sep 2014 06:34:59 GMT
Я думаю, что часть моей проблемы заключается в том, что ответ не возвращает тело, однако я могу предсказать, как это должно выглядеть, и его было бы легко создать после захвата местоположения.
{
"description" : "better",
"_links" : {
"self" : {
"href" : "http://localhost:8080/task/5c75235d-d9f7-4cdd-98b4-3487603d8fcb"
}
}
}
как сделать так, чтобы при создании нового ресурса я мог добавить его в $scope.tasks
список и отразить это в моем ng-repeat
, Опять же, это должно быть без дальнейших вызовов API.
1 ответ
Обновив мой провайдер, который теперь содержит selfLink
определение и post
обработчик. Я извлекаю местоположение из ответа и создаю объект частичного ответа.
.config( function ( RestangularProvider ) {
RestangularProvider.setBaseUrl( 'http://localhost:8080' );
RestangularProvider.setRestangularFields({ selfLink: '_links.self.href' });
RestangularProvider.addResponseInterceptor( function halInterceptor( data, operation, what, url, res ) {
console.log( data, operation, what, url, res );
if ( operation === 'getList' ) {
if ( typeof data._embedded !== 'undefined' ) {
var resp = data._embedded[ what ];
resp.page = data.page;
return resp;
}
else {
return [];
}
}
if ( operation === 'post' && res.status == 201 ) {
return {
_links: {
self: { href: res.headers('Location') }
}
};
}
return data;
} );
Тогда в моем контроллере все, что мне нужно сделать, это использовать angular.extend
объединить ответ и создать "умный объект"
angular.module('lifeManagerApp')
.controller('Task', function ($scope, Restangular) {
var tasks = Restangular.all('task');
if ( typeof $scope.tasks === 'undefined' ) {
$scope.tasks = tasks.getList().$object;
}
$scope.add = function add() {
tasks.post($scope.task).then(function ( task ) {
var obj = angular.extend($scope.task, task);
console.log('add task: ', obj );
$scope.tasks.push(obj);
});
};
});
Стоит отметить, что для моих вещей мне также пришлось обновить CORS и убедиться, что мой контроллер не загружался несколько раз