AngularJS $resource RESTful 예시
$리소스를 사용하여 RESTful 웹 서비스를 호출하고 싶은데(아직 작업 중) Angular가 있는지 알고 싶습니다.먼저 JS 스크립트를 수정합니다.
ToDo DTO에는 다음이 있습니다.{id, order, content, done}
:cmd
내가 전화할 수 있도록api/1/todo/reset
데이터베이스의 작업관리 테이블을 지웁니다.
다음은 저의 이해에 대한 코멘트를 담은 코드입니다.
function TodoService($resource) {
var src = $resource('api/1/todo/:id:cmd',
{id: "@id", cmd: "@cmd"}, //parameters default
{
ListTodos: { method: "GET", params: {} },
GetTodo: { method: "GET", params: { id: 0 } },
CreateTodo: { method: "POST", params: { content: "", order: 0, done: false } },
UpdateTodo: { method: "PATCH", params: { /*...*/ } },
DeleteTodo: { method: "DELETE", params: { id: 0 } },
ResetTodos: { method: "GET", params: { cmd: "reset" } },
});
//Usage:
//GET without ID
//it calls -> api/1/todo
src.ListTodos();
//GET with ID
//it calls -> api/1/todo/4
src.GetTodo({ id: 4 });
//POST with content, order, done
//it calls -> api/1/todo
src.CreateTodo({ content: "learn Javascript", order: 1, done: false });
//UPDATE content only
//it calls -> api/1/todo/5
src.UpdateTodo({ id: 5, content: "learn AngularJS" });
//UPDATE done only
//it calls -> api/1/todo/5
src.UpdateTodo({ id: 5, done: true });
//RESET with cmd
//it calls -> api/1/todo/reset
src.ResetTodos();
}
한 가지 확실한 것은 패치 방식입니다.모든 것을 갱신하고 싶지 않습니다만, 1개의 필드만 갱신할 수 있습니까?이 코드 조각이 올바르게 구성되고 있습니까?
$resource는 엔드포인트에서 데이터를 가져와 조작한 후 반송하는 것을 의미했습니다.그 중 일부는 거기에 있지만, 실제로 그 기능을 활용하지는 못하고 있습니다.
리소스에 커스텀 메서드를 사용하는 것도 좋지만 OOTB에 포함된 뛰어난 기능을 놓치지 마십시오.
편집: 제가 원래 잘 설명하지 못한 것 같은데$resource
반품과 함께 펑키한 것들을 하죠. Todo.get()
그리고.Todo.query()
둘 다 리소스 개체를 반환하고 get이 완료되면 콜백에 전달합니다.무대 뒤에서 약속하는 멋진 일들을 하는데, 그 말은 전화를 걸 수 있다는 거지$save()
이 되기 전에get()
콜백은 실제로 기동하며 대기합니다.약속 내에서 리소스를 처리하는 것이 가장 좋습니다.then()
또는 콜백 방식입니다.
표준 사용
var Todo = $resource('/api/1/todo/:id');
//create a todo
var todo1 = new Todo();
todo1.foo = 'bar';
todo1.something = 123;
todo1.$save();
//get and update a todo
var todo2 = Todo.get({id: 123});
todo2.foo += '!';
todo2.$save();
//which is basically the same as...
Todo.get({id: 123}, function(todo) {
todo.foo += '!';
todo.$save();
});
//get a list of todos
Todo.query(function(todos) {
//do something with todos
angular.forEach(todos, function(todo) {
todo.foo += ' something';
todo.$save();
});
});
//delete a todo
Todo.$delete({id: 123});
마찬가지로 OP에 게시한 내용의 경우 리소스 개체를 가져온 다음 리소스 개체에서 사용자 지정 함수를 호출할 수 있습니다(이론적으로).
var something = src.GetTodo({id: 123});
something.foo = 'hi there';
something.UpdateTodo();
저는 OOTB 실장을 실험해보고는 했습니다만, 제 것을 발명하기 전에 말이죠.기본 기능을 사용하지 않는 경우$resource
, 아마 당신은 그냥 를 사용해야 할 것입니다.$http
스스로 할 수 있어요.
업데이트: Angular 1.2 및 약속
Angular 1.2에서 리소스는 약속을 지원합니다.하지만 그들은 나머지 행동을 바꾸지 않았다.
와의 약속을 활용하다$resource
, 를 사용해야 합니다.$promise
반환된 값에 대한 속성입니다.
약속 사용 예시
var Todo = $resource('/api/1/todo/:id');
Todo.get({id: 123}).$promise.then(function(todo) {
// success
$scope.todos = todos;
}, function(errResponse) {
// fail
});
Todo.query().$promise.then(function(todos) {
// success
$scope.todos = todos;
}, function(errResponse) {
// fail
});
단지, 그 점에 유의해 주세요.$promise
property는 위에서 반환한 값과 동일한 값의 속성입니다.이상해질 수 있어요
이것들은 동등하다.
var todo = Todo.get({id: 123}, function() {
$scope.todo = todo;
});
Todo.get({id: 123}, function(todo) {
$scope.todo = todo;
});
Todo.get({id: 123}).$promise.then(function(todo) {
$scope.todo = todo;
});
var todo = Todo.get({id: 123});
todo.$promise.then(function() {
$scope.todo = todo;
});
그냥 하면 돼$scope.todo = Todo.get({ id: 123 })
..get()
그리고..query()
리소스에서 개체를 즉시 반환하고 나중에 약속 결과로 채웁니다(템플릿 업데이트).이는 일반적인 약속이 아니기 때문에 콜백 또는 $promise 속성을 사용해야 합니다.콜 후에 실행하는 특별한 코드가 있는 경우입니다.단, 템플릿에서만 사용하는 경우에는 콜백에서 스코프에 할당할 필요가 없습니다.
언급URL : https://stackoverflow.com/questions/13269882/angularjs-resource-restful-example
'programing' 카테고리의 다른 글
jsTree - 요청 시 Ajax를 통해 하위 노드 로드 (0) | 2023.03.26 |
---|---|
여러 식에서 ng-click을 사용하는 방법 (0) | 2023.03.26 |
스프링 부트 애플리케이션을 실행하기 위한 "gradle boot Run"과 "gradle run"의 차이점은 무엇입니까? (0) | 2023.03.21 |
워드프레스 테마 사용자 지정기 - 섹션/설정을 추가할 수 없습니다. (0) | 2023.03.21 |
컨트롤러 내에서 $setValid 사용 (0) | 2023.03.21 |