서버에서 데이터를 얻는 권장 방법


145

사용하지 않고 AngularJS와에 서버 데이터 소스에 연결하기 위해 권장되는 방법은 무엇입니까 $resource.

다음 $resource과 같은 많은 제한 이 있습니다.

  1. 적절한 미래를 사용하지 않음
  2. 충분히 유연하지 않다

6
이 문제 (https://github.com/angular/angular.js/issues/415) 가 종료 된 경우 $ resource에 올바른 선물을 사용하지 않는 데 한계가 있다는 것이 여전히 사실 입니까? (질문이 혼란 스러우면 Angular를 처음 사용합니다. )
Jason Sydes

1
여기 자신의 질문에 대답하는 것이 합법적입니다. "질문하기"를 누르십시오. 그것은 "귀하의 지식을 공유하십시오"
holms

답변:


229

백엔드와 대화 할 때 $ resource가 적절하지 않은 경우가 있습니다. 리소스를 사용하지 않고 $ resource와 같은 동작을 설정하는 방법을 보여줍니다.

angular.module('myApp').factory('Book', function($http) {
  // Book is a class which we can use for retrieving and 
  // updating data on the server
  var Book = function(data) {
    angular.extend(this, data);
  }

  // a static method to retrieve Book by ID
  Book.get = function(id) {
    return $http.get('/Book/' + id).then(function(response) {
      return new Book(response.data);
    });
  };

  // an instance method to create a new Book
  Book.prototype.create = function() {
    var book = this;
    return $http.post('/Book/', book).then(function(response) {
      book.id = response.data.id;
      return book;
    });
  }

  return Book;
});

그런 다음 컨트롤러 내부에서 다음을 수행 할 수 있습니다.

var AppController = function(Book) {
  // to create a Book
  var book = new Book();
  book.name = 'AngularJS in nutshell';
  book.create();

  // to retrieve a book
  var bookPromise = Book.get(123);
  bookPromise.then(function(b) {
    book = b;
  });
};

1
어쩌면 멍청한 질문이지만 어떻게 단일 응답이 아닌 여러 응답을 반환하는 get ()을 허용하도록이를 확장합니까?
네이트 버니

2
@NathanBunney, 정적 get 메소드가 결과를 반복하도록하고 책 배열을 작성할 수 있습니다.
Ben Lesh

4
@NathanBunney 'Book.getAll = function () {return $ http.get ('/ Book '). then (function (response) {var books = []; for (var i = 0; i <response.data.length ; i ++) {books.push (new Book (response.data [i]));} 도서 반환;}); }; '
Yair Nevet

2
컨트롤러간에 book또는 컬렉션을 어떻게 공유 book하시겠습니까?
루카스

1
이것은 훌륭합니다 (Misko가 프레임 워크를 만든 이후).하지만 재사용 가능하게 만드는 방법을 알아 내려고 고심하고 있습니다. CRUD 함수를 한 번만 구현 한 다음 urlBase 인수 만 필요한 하위 팩토리 / 서비스에서 기능을 상속하려면 (각 인스턴스에 새로운 urlBase 사본이 필요하지 않도록 프로토 타입에 저장하는 것이 바람직 함) 어떻게해야합니까? 내가합니까?
딘 스태 믈러

26

$ resource 를 사용하는 것이 좋습니다 .

다음 버전의 Angularjs에서 (url override)를 지원할 수 있습니다. 그러면 다음과 같이 코드를 작성할 수 있습니다.

// need to register as a serviceName
$resource('/user/:userId', {userId:'@id'}, {
    'customActionName':    {
        url:'/user/someURI'
        method:'GET',
        params: {
            param1: '....',
            param2: '....',
        }
    },
     ....
});

그리고 리턴 콜백은 이와 같이 ctrl 범위에서 처리 될 수 있습니다.

// ctrl scope
serviceName.customActionName ({
    paramName:'param',
    ...
}, 
function (resp) {
    //handle return callback
}, 
function (error) {
    //handler error callback
});

아마도 더 높은 추상화 수준에서 코드를 처리 할 수 ​​있습니다.


2
angular.js의 현재 버전은 $ resource 모듈에서 url override를 지원합니다.
thanksnote

16
하하 당신은 무언가를하는 방법에 대한 프레임 워크의 실제 제작자를 추천하고 있습니다 : P
HeberLZ

11
세상에! 부끄러워
thanksnote
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.