Question

我用angularJS构建了一个简单的过滤器，html就像

<a class="filterbutton" ng-click="filters.grade = '7'">7 Grade</a>
<a class="filterbutton" ng-click="filters.grade = '6'">6 Grade</a>
<a class="filterbutton" ng-click="filters.grade = ''">X Clear Filters</a>

<ul>
  <li ng-repeat="name in names | filter:filters">{{name.student}}, {{name.grade}} grade</li>
</ul>

控制器：

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {

$scope.filters = { };

$scope.names = [{
"student": "Jimmy", "grade":7
}, {
"student": "Johny", "grade":7
}, {
"student": "Little Joe", "grade":6
}];
});

这可以按预期工作。但我想要做的是能够检查其中一个过滤器并使用相同的控制器跳转到另一个页面，以便在加载时第二页已经过滤。例如，如果我点击“在另一个页面中按7级过滤”，它将跳转到anotherpage.html，那里的输出已经过滤。

我有made a plunkr here来说明我的意思。提前谢谢！

Answer 1

您也可以尝试这个简单的solution：

HTML （将过滤器参数添加到 href 属性）：

<a class="filterbutton" href="anotherpage.html?filter=7">Filter by 7 Grade in Another Page</a>
<a class="filterbutton" href="anotherpage.html?filter=6">Filter by 6 Grade in Another Page</a>

Javascript （从网址获取并应用它们）

app.controller('myCtrl', function($scope) {

  $scope.filters = { grade : window.location.search.replace('?filter=','') };

  $scope.names = [{
    "student": "Jimmy", "grade":7
  }, {
    "student": "Johny", "grade":7
  }, {
    "student": "Little Joe", "grade":6
  }];

});

AngularJS - 定位另一个页面时进行过滤

1 个答案: