2013-05-23 16 views
28

私はangular.jsを手に入れようとしており、文書化されていないものもいくつか考えています。

これを考慮します - クエリパラメータを受け取り、検索結果のコレクションを返し、GET /search.jsonルート(Rails FWIW)に応答する検索メソッドがサーバー上にあります。

のでjQueryで、サンプルクエリは次のようになります。

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

私は角使ってこれを実装し、それがどのように動作するかのまわりで私の頭をラップしようとしています。これは私が今持っているものです。

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: [ { ... }, { ... }, ... ] 
    }); 
    } 
}]); 

とビューで:

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

しかし、私はTypeError: Object #<Resource> has no method 'push'$apply already in progressのようなエラーを得続けます。それは、かつて$resourceを初期化して、要求された検索の変更に異なるクエリパラメータを渡すために、より直感的なようだ

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

物事は、私は次のように$resource初期設定を変更した場合に予想されるように動作するように思われます。私はそれが間違っている(ほとんどの場合)か、最初の引数として$resource.queryをquery paramsオブジェクトと呼んでいるドキュメントを誤解しているかどうかは疑問です。ありがとう。

答えて

24

TypeError: Object # has no method 'push' and $apply already in progress

名前検索とリソースを定義していないので。まず、そのようなリソースを定義する必要があります。 Doc: $resource。ここでの実装例

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

はアプリあなたにこのモジュールを含めると、私は、これは何が必要であるかどうかわからないのですが、この

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

のようなコントローラで使用されます。リソースサービスは、RESTfulなサーバーサイドのデータソース、つまりREST APIと対話します。

たぶん、あなたは、HTTP GETだけのシンプルなものが必要です

$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

+0

は '事前にトリックをしない' VAR検索= $リソース(...)を設定していますか?私はまだサービスや工場のアイデアを試していると思います。また、私の最初の試みは '$ http'で行われ、うまくいきました。私は '$ resource'を試してみたかったのですが、どちらかを使う気がしました。ありがとう! – sa125

+3

Hm var Search = $ resource(...)は実際には正しいです。しかし、リソースはオブジェクトが返されることを期待していますが、配列を返しますか?クエリメソッドでisArray:trueを設定してみてください。同様の問題https://groups.google.com/forum/#!topic/angular/MT1vIakNEVM –

+1

なぜクエリパラメータをオーバーライドしますか? – Vincent

関連する問題