Рекомендований спосіб отримання даних із сервера


145

Який рекомендований спосіб підключення до джерел даних сервера в AngularJS без використання $resource.

$resourceМає багато обмежень , таких як:

  1. Не використовуючи належні ф'ючерси
  2. Не є досить гнучким

6
Чи все-таки правда, що $ ресурс має обмеження не використовувати належні ф'ючерси, враховуючи, що ця проблема (https://github.com/angular/angular.js/isissue/415) закрита? (Я новачок у Angular, мої вибачення, якщо питання є заплутаним.) EDIT - Ця фіксація ( github.com/angular/angular.js/commit/… ) також, здається, говорить про те, що $ ресурс більше не може мати таке обмеження?
Jason Sydes

1
ну це законно, щоб відповісти на власні запитання ..ок? прес «Задати питання», який називається «поділитися своїми знаннями»
Holms

Відповіді:


229

Бувають випадки, коли $ ресурс може виявитися невідповідним під час розмови з бекендом. Це показує, як налаштувати $ 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
Можливо питання noob, але як би розширити це, щоб дозволити get (), який повернув кілька відповідей, а не лише одну відповідь?
Нейт Банні

2
@NathanBunney, ви можете мати свій метод статичного отримання вище циклу за результатами та створити масив Books.
Бен Леш

4
@NathanBunney 'Book.getAll = function () {return $ http.get (' / Book '). Тоді (функція (відповідь) {var books = []; for (var i = 0; i <response.data.length ; i ++) {books.push (нова книга (відповідь.дані [i]));} повернути книги;}); }; '
Яїр Невет

2
Як би ви поділилися bookабо колекцією books між контролерами?
Лукас

1
Це чудово (очевидно, оскільки Місько створив рамки), але я намагаюся зрозуміти, як зробити його багаторазовим. Якщо я хотів би реалізувати функції CRUD лише один раз, а потім успадкувати їх функціональність у дочірніх фабриках / службах, яким потрібен лише аргумент urlBase (бажано, що зберігається на прототипі, щоб кожному екземпляру не потрібна нова копія urlBase), як би Я це роблю?
Дін Стамлер

26

Я рекомендую використовувати ресурс $ .

Він може підтримувати (переопределення URL) у наступній версії Angularjs. Тоді ви зможете кодувати так:

// 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 підтримує перезапис URL-адреси в модулі $ resource.
подяка

16
Ха-ха, ви рекомендуєте фактичного творця рамки про те, як щось робити: P
HeberLZ

11
О БОЖЕ МІЙ! Мені соромно.
подяка
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.