AngularJS - 使用$ resource.query与params对象 [英] AngularJS - Using $resource.query with params object

查看：432 发布时间：2016/4/7 23:12:45 angularjs query-parameters angular-resource

本文介绍了AngularJS - 使用$ resource.query与params对象的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我试图拿起 angular.js 并找出一些工作那是有点不太记录的东西。

考虑这一点 - 我有一个接受查询参数，返回的搜索结果集合的服务器上的搜索方法，并响应 GET /search.json 路线（Rails的FWIW）。

因此，与的jQuery ，一个简单的查询是这样的：

  $的getJSON（'/搜索'，{Q：JavaScript的限制：10}，功能（RESP）{
  // RESP是对象的数组：[{...}，{...}，...]
}）;

我想实现这个采用了棱角分明，和我的包裹围绕它是如何工作的头。这就是我现在：

  VAR应用= angular.module（'searchApp'，['ngResource']）;app.controller（'SearchController'，['$范围，$资源'，函数（$范围，$资源）{  $ scope.search =功能（）{
    变种搜索= $资源（'/ search.json'）;
    Search.query（{Q：JavaScript的限制：10}，功能（RESP）{
      //我的预期RESP是像以前一样，即
      //资源对象的数组：[{...}，{...}，...]
    }）;
  }
}]）;

和视图：

 ＆LT;机身NG-应用=searchApp＆GT;
  ...
  ＆LT; DIV NG控制器=SearchController＆GT;
    ...
    ＆LT;形式NG提交=搜索（）＆GT; ...＆LT; /表及GT;
    ...
   ＆LT; / DIV＆GT;
＆LT; /身体GT;

不过，我一直喜欢收到错误类型错误：对象＃＆LT;资源与GT;没有方法推和 $已经在进行中适用。

事情似乎工作，如果我更改 $资源初始化以下预期：

 变种搜索= $资源（+ $ .PARAM（{Q：JavaScript的限制：10}/ search.json？））;
Search.query（功能（RESP）{...}）;

这似乎更直观的初始化 $资源一次，然后通过不同的查询参数与请求的搜索改变。我不知道如果我做错了（最有可能），或者只是误解的文档，调用 $ resource.query 与查询params对象作为第一个参数是可行的。谢谢。

解决方案

类型错误：对象＃没有方法推和$已申请
在建

因为你没有用名称定义的资源搜索即可。首先，你需要定义这样的资源。 文件：$资源 。这里是一个例子实施
  angular.module（'为MyService'，['ngResource']）
       .factory（'MyResource'，['$资源'，函数（$资源）{    VAR MyResource = $资源（'/ API /：动作/：查询'，{
        查询：'@查询
    }，{
        搜索：{
            方法：GET，
            params：一个{
                动作：搜索，
                查询：'@query
            }
        }
    }）;
    返回MyResource;
}]）;
 
在你的应用程序
包含此模块，并在这样的控制器使用它
  $ scope.search_results = MyResource.search（{
   查询：'foobar的'
}，功能（结果）{}）;
 
不过我不知道这是否是你所需要的。资源服务REST风格的服务器端数据源又名REST API进行交互。
也许你需要只是一个简单的HTTP GET：
  $ HTTP（{方法：GET，网址：'/ someUrl'}）。
  成功（功能（数据，状态，头，配置）{
    //这个回调函数将被异步调用
    //当响应可用
  }）。
  错误（功能（数据，状态，头，配置）{
    //异步调用，如果发生错误
    //或服务器返回的响应与一个错误状态。
  }）;
 
http://docs.angularjs.org/api/ng.$http
I'm trying to pick up angular.js and working on figuring out some of the things that are a bit less documented.

Consider this - I have a search method on the server that accepts query params and returns a collection of search results, and responds to GET /search.json route (Rails FWIW).

So with jQuery, a sample query would look like this:
$.getJSON('/search', { q: "javascript", limit: 10 }, function(resp) {
  // resp is an array of objects: [ { ... }, { ... }, ... ]
});
I'm trying implement this using angular, and wrap my head around how it works. This is what I have now:
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: [ { ... }, { ... }, ... ]
    });
  }
}]);
And in the view:
<body ng-app="searchApp">
  ...
  <div ng-controller="SearchController">
    ...
    <form ng-submit="search()">...</form>
    ...
   </div>
</body>
However, I keep getting errors like TypeError: Object #<Resource> has no method 'push' and $apply already in progress.

Things seem to work out as expected if I change the $resource initialization to the following:
var Search = $resource("/search.json?" + $.param({ q: "javascript", limit: 10 }));
Search.query(function(resp){ ... });
It seems more intuitive to initialize the $resource once and then pass different query parameters with changes in the requested search. I wonder if I'm doing it wrong (most likely) or just misunderstood the docs that calling $resource.query with the query params object as the first argument is feasible. thanks.
解决方案

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

because you have not defined a resources with the name Search. First you need to define such a resource. Doc: $resource. Here is an example implementation
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;
}]); 
Include this module in you app and use it in a controller like this
$scope.search_results = MyResource.search({
   query: 'foobar'  
}, function(result){}); 
However I am not sure if this is what you need. The resource service interacts with RESTful server-side data sources aka REST API.

Maybe you need just a simple 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

这篇关于AngularJS - 使用$ resource.query与params对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

AngularJS - 使用$ resource.query与params对象 [英] AngularJS - Using $resource.query with params object

问题描述

相关文章

JavaScript最新文章

热门教程

热门工具

登录关闭

AngularJS - 使用$ resource.query与params对象 [英] AngularJS - Using $resource.query with params object

问题描述

相关文章

JavaScript最新文章

热门教程

热门工具

登录 关闭

登录关闭