Question

我正在尝试这样做，似乎无法弄明白。

我正在使用资源来使用其他API，如下所示：

.factory('Professor', [
  '$resource', function($resource) {
    return $resource('/api/professors/:id', {
      id: '@id'
    });
  }
]);

这使我获得了以下形式的JSON：

[
  {
    'id' : 1,
    'name' : 'John Doe',
    'slug' : 'john-doe',  
  },
  {
    'id' : 2,
    'name' : 'Jane Austin',
    'slug' : 'jane-austin', 
  }
]

我的路线就像这样

.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider
      .when('/professor/:professor_id/:professor_slug', {
        controller : 'ProfessorDetailController',
        templateUrl : 'static/templates/partials/professor_detail.html'
      })
      .otherwise({ redirectTo : '/' });
  }
]);

我的控制器看起来像这样

.controller('ProfessorDetailController', [
    '$scope', '$routeParams', 'Professor', 
    function($scope, $routeParams, Professor) {
      $scope.professor_id = $routeParams.professor_id;
      $scope.professor_slug = $routeParams.professor_slug;
      $scope.professors = Professor.query();
    }
]);

现在让我们说用户转到以下网址：

www.mysite.com /＃/教授/ 2 /简奥斯汀

我想在控制器中过滤查询，只包含Jane的信息。现在我不确定这个过滤是否应该在模板或控制器中完成，但无论哪种方式我都无法弄明白。有关如何执行此操作的任何帮助吗？

注意，slug字段和id字段都必须与路由参数匹配。 id显然是独一无二的。

Answer 1

AngularJS有一个名为$ filter的内置过滤器，可用于根据某些条件减少数组，我们必须将其作为$ filter注入。使用此过滤器，您可以按属性或文本指定条件，以便控制器应该是这样的。

.controller('ProfessorDetailController', [
    '$scope','$filter', '$routeParams', 'Professor', 
    function($scope,$filter, $routeParams, Professor) {
      $scope.professor_id = $routeParams.professor_id;
      $scope.professor_slug = $routeParams.professor_slug;
      $scope.professors = Professor.query();
      $scope.filteredProfByText = $filter('filter')($scope.professors, 'jean'); // by text, it will check inside name and gender
      $scope.filteredProfByName = $filter('filter')($scope.professors, {name : 'Jane Austin'}); // by attribute
    }
]);

如何使用AngularJs中的路由参数过滤JSON查询？

1 个答案: