Empfohlene Methode zum Abrufen von Daten vom Server

145

Was ist die empfohlene Methode, um eine Verbindung zu Serverdatenquellen in AngularJS ohne Verwendung herzustellen? $resource .

Das $resourcehat viele Einschränkungen wie:

  1. Keine richtigen Futures verwenden
  2. Nicht flexibel genug
Misko Hevery
quelle
6
Stimmt es immer noch, dass $ resource die Einschränkung hat, keine richtigen Futures zu verwenden, da dieses Problem (https://github.com/angular/angular.js/issues/415) geschlossen wurde? (Ich bin neu bei Angular. Ich entschuldige mich, wenn die Frage verwirrend ist.) BEARBEITEN - Dieses Commit ( github.com/angular/angular.js/commit/… ) scheint auch darauf hinzudeuten , dass $ resource diese Einschränkung möglicherweise nicht mehr hat.
Jason Sydes
1
Nun, hier ist es legal, deine eigenen Fragen zu beantworten. Drücken Sie "Frage stellen", das heißt "Teilen Sie Ihr Wissen"
Holms

Antworten:

229

Es gibt Fälle, in denen $ resource möglicherweise nicht geeignet ist, wenn Sie mit dem Backend sprechen. Dies zeigt, wie Sie ein $ resource-ähnliches Verhalten einrichten, ohne eine Ressource zu verwenden.

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

Dann können Sie in Ihrem Controller:

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;
  });
};
Misko Hevery
quelle
1
Vielleicht eine Noob-Frage, aber wie würde man diese erweitern, um ein get () zu ermöglichen, das mehrere Antworten zurückgibt, nicht nur eine einzige Antwort?
Nate Bunney
2
@NathanBunney, Sie könnten Ihre statische get-Methode über den Ergebnissen durchlaufen lassen und eine Reihe von Büchern erstellen.
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 (neues Buch (response.data [i]));} Bücher zurückgeben;}); }; '
Yair Nevet
2
Wie würden Sie eine bookoder eine Sammlung von books zwischen Controllern teilen ?
Lukas
1
Das ist großartig (offensichtlich seit Misko das Framework erstellt hat), aber ich habe Mühe herauszufinden, wie ich es wiederverwendbar machen kann. Wenn ich die CRUD-Funktionen nur einmal implementieren und dann ihre Funktionalität in untergeordneten Fabriken / Diensten erben wollte, für die nur ein urlBase-Argument erforderlich war (vorzugsweise auf dem Prototyp gespeichert, damit für jede Instanz keine neue Kopie der urlBase erforderlich war), wie würde dies geschehen? Ich mach das?
Dean Stamler
26

Ich empfehle Ihnen, $ resource zu verwenden .

Möglicherweise wird (URL-Überschreibung) in der nächsten Version von Angularjs unterstützt. Dann können Sie wie folgt codieren:

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

Und Rückrufe können im Strg-Bereich wie folgt behandelt werden.

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

Wahrscheinlich können Sie Code auf höherer Abstraktionsebene verarbeiten.

Dankeschön
quelle
2
Die aktuelle Version von angle.js unterstützt das Überschreiben von URLs im Modul $ resource.
Dankesnotiz
16
Haha, Sie empfehlen dem eigentlichen Schöpfer des Frameworks, wie man etwas macht: P
HeberLZ
11
OH MEIN GOTT! Ich fühle mich so beschämt.
Dankeschön