Cách nhận dữ liệu từ máy chủ


145

Cách được đề xuất để kết nối với các nguồn dữ liệu máy chủ trong AngularJS mà không cần sử dụng $resource.

$resourcenhiều hạn chế như:

  1. Không sử dụng hợp đồng tương lai
  2. Không đủ linh hoạt

6
Có phải sự thật là $ resource có giới hạn là không sử dụng hợp đồng tương lai phù hợp do vấn đề này (https://github.com/angular/angular.js/issues/415) đã bị đóng? (Tôi mới đến góc, lời xin lỗi của tôi nếu câu hỏi là khó hiểu.) EDIT - Đây cam kết ( github.com/angular/angular.js/commit/... ) cũng dường như cho thấy rằng $ tài nguyên có thể không có giới hạn đó nữa?
Jason Sydes

1
Vâng, nó hợp pháp ở đây để trả lời câu hỏi của riêng bạn ..ok? nhấn "Đặt câu hỏi", đó gọi là "chia sẻ kiến ​​thức của bạn"
holms 20/07/13

Câu trả lời:


229

Có những trường hợp khi $ resource có thể không phù hợp khi nói chuyện với phụ trợ. Điều này cho thấy cách thiết lập $ resource như hành vi mà không cần sử dụng tài nguyên.

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;
});

Sau đó, bên trong bộ điều khiển của bạn, bạn có thể:

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
Có thể là một câu hỏi không, nhưng làm thế nào người ta có thể mở rộng câu hỏi này để cho phép một get () trả về nhiều câu trả lời không chỉ là một câu trả lời?
Nate Bunney

2
@NathanBunney, bạn có thể có phương thức lấy tĩnh trên vòng lặp thông qua các kết quả và xây dựng một mảng Sách.
Ben Lesh

4
@NathanBunney 'Book.get ALL = function () {return $ http.get (' / Book '). Sau đó (function (hồi đáp) {var Books = []; for (var i = 0; i <respons.data.length ; i ++) {Books.push (Sách mới (answer.data [i]));} trả lại sách;}); }; '
Yair Nevet

2
Làm thế nào bạn sẽ chia sẻ một bookhoặc bộ sưu tập bookgiữa các bộ điều khiển?
Lukas

1
Điều này thật tuyệt (rõ ràng vì Misko đã tạo khung), nhưng tôi đang cố gắng tìm ra cách làm cho nó có thể tái sử dụng. Nếu tôi chỉ muốn triển khai các hàm CRUD một lần và sau đó kế thừa chức năng của chúng trong các nhà máy / dịch vụ con chỉ cần một đối số urlBase (tốt nhất là được lưu trữ trên nguyên mẫu để mỗi phiên bản không cần một bản sao mới của urlBase), thì làm sao Tôi làm điều đó?
Dean Stamler

26

Tôi khuyên bạn nên sử dụng $ resource .

Nó có thể hỗ trợ (ghi đè url) trong phiên bản tiếp theo của Angularjs. Sau đó, bạn sẽ có thể mã như thế này:

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

Và các cuộc gọi lại có thể được xử lý trong phạm vi ctrl như thế này.

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

Có lẽ bạn có thể xử lý mã ở mức độ trừu tượng cao hơn.


2
Phiên bản hiện tại của angular.js hỗ trợ ghi đè url trong mô-đun tài nguyên $.
lời cảm ơn

16
Haha bạn đang đề xuất người tạo thực tế của khung về cách làm một cái gì đó: P
HeberLZ

11
CHÚA ƠI! Tôi cảm thấy rất xấu hổ.
lời cảm ơn
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.