dynamically change ng-repeat filter using params from ui-sref

So I have a custom filter set up in my ng-repeat list which I can change dynamically using different buttons with the same page.

My question is, how do I go about changing this filter, with a value outside of the page.

To clarify, I have an ng-repeat list on my 'list.view.html' and I would like to be able to press a button on my homepage, which includes a filter value, and load the 'list.view.html' with the filtered results including the param of the button on my homepage.

To iterate further,

above my ng-repeat on list.view.html, I include buttons like so:

<button class="sortBy" ng-click="myFilter =  { statusOpen : true }">Open</button>

Which updates my ng-repeat to only include items where the statusOpen boolean evaluates to true.

Here is the filter in my ng-repeat

<li class="list-group-item animate-repeat" data-ng-repeat="task in vm.tasks | filter:search | filter:myFilter>

How would I achieve the same result by clicking a button on the homepage which routes to the list.view.html page with filtered results?

I have tried setting a param filter in the controller for the list.view.html however I couldn't get it to work.

e.g <a ui-sref="tasks.list({ myFilter = { onlineTask : 'true' } })"> on my homepage and :: on my client.routes.js

 params: {
       myFilter: null
 }

console error message

angular.js:11706 Error: [$parse:syntax] Syntax Error: Token '=' is unexpected, expecting [:] at column 12 of the expression [{ myFilter = { onlineTask : 'true' } }] starting at [= { onlineTask : 'true' } }]. http://errors.angularjs.org/1.3.20/$parse/syntax?p0=%3D&p1=is%20unexpected%2C%20expecting%20%5B%3A%5D&p2=12&p3=%7B%20myFilter%20%3D%20%7B"

I am just looking for some general direction on how to proceed with this please.

Thanks very much in advance

I think that setting needed params in angular-ui filter is the best way to achive what you want.

You just have to remember to:

1. Set up you URL properly (include param in URL) and process params using $stateParams service in yout controller. You may use array if you have more then one filter:

   $stateProvider
   .state('search', {
     url: "/search/?myFilter",
     templateUrl: 'search.html',
     controller: function ($stateParams) {
     // Get filter(s)
      console.log($stateParams.myFilter);
     }
   })
   

2. Properly assign your params in ui-sref (use colon!):

   <a ui-sref="filter({ myFilter: ['filter1','filter2'] })">Go and filter</a>

See example: http://plnkr.co/edit/QOHNYHVPRJ8iBm3Adjcj?p=preview