AngularJS - 更改$ routeProvider中的查询参数项？ [英] AngularJS - Changing a query param term within $routeProvider?

问题描述

我创建一个导航，在那里当上了活跃的链接，进给负载，但使用不同的搜索词。

I am creating a navigation, where when on the active 'link', a feed loads but with a different searched term.

基本上，所有链路是相同的，唯一的区别是在.factory参数术语集

Basically, the all the links are the same, the only difference is the term set in the .factory parameter.

由于一切都是相同的（甚至是.controller，是有可能设置routeProvider，在那里我可以指定需要搜索的术语内的查询词？

Since everything is the same (even the .controller, is it possible to set the query term inside of the routeProvider, where I can specify the term that needs to be searched?

或将唯一的方法是创建每个连接一个新的控制器，并设置里面有期限？保持code简单，有效和尽可能少，是我试图瞄准。

Or will the only way is to create a new controller for each link, and set the term inside of there? Keeping the code simple, efficient and as little as possible, is what I am trying to aim for.

  angular.module('termSearch', ['ngResource'])

  .config(['$httpProvider', function ($httpProvider) {
      $httpProvider.defaults.headers.common["X-Requested-With"] = undefined;
  }])

  .config(function($routeProvider) {
    $routeProvider
      .when('/term1', {templateUrl: 'views/feedlist.html', controller: 'searchtermCtrl' })      
      .when('/term2', {templateUrl: 'views/feedlist.html', controller: 'searchtermCtrl' })

      .otherwise({redirectTo: '/term1'});
  })

  .factory('Feed', function ($resource) {
      return $resource('https://www,example.com/:term/json', {}, {
          query: {
              method: 'GET',
              isArray: false,
              params: {
                  term: "term#"
              }
          }
      });  
  })

  .controller('searchtermCtrl', function($scope, Feed){
    $scope.results = Feed.query();
    $scope.feed = function (term) {
        Feed.get({
            term: term
        }, function (results) {
            $scope.results = results
            console.log(results);
        });
    }
  })

感谢在正确的方向的任何帮助。

Thanks for any help in the right direction.

大鹏。

推荐答案

使用资源占位符和$ routeParams你定义一个哈希URL看起来像这样＆LT; A HREF =＃术语/搜索+长期在这里+＆GT;项x LT; / A＆GT; 。搜索条件可以是用户输入或术语数据库，从列表

Using resource placeholders and $routeParams you define a hash URL which looks something like this <a href="#term/search+term+here">Term X</a>. The search term can be user input or a list of terms from database

  angular.module('termSearch', ['ngResource'])

  .config(['$httpProvider', function ($httpProvider) {
      $httpProvider.defaults.headers.common["X-Requested-With"] = undefined;
  }])

  .config(function($routeProvider) {
    $routeProvider
      .when('/term/:q', {templateUrl: 'views/feedlist.html', controller: 'searchtermCtrl' })      

      .otherwise({redirectTo: '/term/'});
  })

  .factory('Feed', function ($resource) {
      return $resource('https://www.example.com/:term/json', {}, {
          query: {
              method: 'GET',
              isArray: false
          }
      });  
  })

  .controller('searchtermCtrl', function($scope, Feed, $routeParams){
    $scope.feed = Feed.query({ term : $routeParams.q }); // This will get the term from url
  })

现在，当路由变化到新学期的资源是发送新的数据参数

Now when the route changes to a new term the resource is send new data parameters

这篇关于AngularJS - 更改$ routeProvider中的查询参数项？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！