AngularJS - Filtering when targeting another page -

i have built simple filter 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> 

and controller:

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

this works expected. wanted able check 1 of filters , jump page same controller, when loaded second page filtered. example, if click "filter 7 grade in page", jump anotherpage.html , output there filtered.

i have made plunkr here illustrate mean. in advance!

also can try simple solution:

html (add filter parameter href attribute):

<a class="filterbutton" href="anotherpage.html?filter=7">filter 7 grade in page</a> <a class="filterbutton" href="anotherpage.html?filter=6">filter 6 grade in page</a> 

javascript (get them url , apply it)

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