it-swarm.com.de

AngularJS - Verwenden von $ resource.query mit dem Objekt params

Ich versuche, angular.js aufzugreifen und einige der Dinge herauszufinden, die ein bisschen weniger dokumentiert sind.

Bedenken Sie Folgendes: Ich habe eine Suchmethode auf dem Server, die Abfrageparameter akzeptiert, eine Sammlung von Suchergebnissen zurückgibt und auf die Route GET /search.json (Rails FWIW) reagiert.

Mit jQuery würde eine Beispielabfrage folgendermaßen aussehen:

$.getJSON('/search', { q: "javascript", limit: 10 }, function(resp) {
  // resp is an array of objects: [ { ... }, { ... }, ... ]
});

Ich versuche dies mit eckigen umzusetzen und wickle meinen Kopf darum, wie es funktioniert. Das habe ich jetzt:

var app = angular.module('searchApp', ['ngResource']);

app.controller('SearchController', ['$scope', '$resource', function($scope, $resource){

  $scope.search = function() {
    var Search = $resource('/search.json');
    Search.query({ q: "javascript", limit: 10 }, function(resp){
      // I expected resp be the same as before, i.e
      // an array of Resource objects: [ { ... }, { ... }, ... ]
    });
  }
}]);

Und in der Ansicht:

<body ng-app="searchApp">
  ...
  <div ng-controller="SearchController">
    ...
    <form ng-submit="search()">...</form>
    ...
   </div>
</body>

Ich erhalte jedoch immer wieder Fehler wie TypeError: Object #<Resource> has no method 'Push' Und $apply already in progress.

Die Dinge scheinen wie erwartet zu funktionieren, wenn ich die $resource - Initialisierung wie folgt ändere:

var Search = $resource("/search.json?" + $.param({ q: "javascript", limit: 10 }));
Search.query(function(resp){ ... });

Es erscheint intuitiver, den $resource Einmal zu initialisieren und dann verschiedene Abfrageparameter mit Änderungen in der angeforderten Suche zu übergeben. Ich frage mich, ob ich es falsch mache (höchstwahrscheinlich) oder die Dokumente falsch verstanden habe, dass der Aufruf von $resource.query Mit dem query params-Objekt als erstem Argument machbar ist. Vielen Dank.

28
sa125

TypeError: Objekt # hat keine Methode 'Push' und $ wird bereits angewendet

weil Sie keine Ressourcen mit dem Namen Suche definiert haben. Zuerst müssen Sie eine solche Ressource definieren. Doc: $ resource . Hier ist eine Beispielimplementierung

angular.module('MyService', ['ngResource'])
       .factory('MyResource', ['$resource', function($resource){

    var MyResource = $resource('/api/:action/:query',{
        query:'@query'
    }, { 
        search: {
            method: 'GET',
            params: {
                action: "search",
                query: '@query'
            }
        }
    }); 
    return MyResource;
}]); 

Binden Sie dieses Modul in Ihre App ein und verwenden Sie es in einem Controller wie diesem

$scope.search_results = MyResource.search({
   query: 'foobar'  
}, function(result){}); 

Ich bin mir jedoch nicht sicher, ob Sie das brauchen. Der Ressourcendienst interagiert mit serverseitigen REST-Datenquellen, auch bekannt als REST API.

Vielleicht brauchst du nur einen einfachen http:

 $http({method: 'GET', url: '/someUrl'}).
  success(function(data, status, headers, config) {
    // this callback will be called asynchronously
    // when the response is available
  }).
  error(function(data, status, headers, config) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });

http://docs.angularjs.org/api/ng.$http

24
Upvote