get settings service value into Angular filter

[Andrew Peacock]

Hi,
I'm stuck on passing a value between pages:

The app consists of an index page with a side menu. The side menu contains a list based of an ng-repeat for this array:

[{tag_id:1, text:"This tag"},
{tag_id:2, text:"That tag"}]

tag_id is the important variable that needs to be retained on the click event.

I then have a list in a second page (called "notifications") which requires a custom filter based on that tag_id. The list is displaying objects like this:
[{id:101, name:"object 1", "tag_id": 1},
{id:102, name:"object 2", "tag_id": 1},
{id:103, name:"object 3", "tag_id": 2}],
etc

The "notifications" page list is set up as :

ng-repeat = notification in notifications | filterNotificationsByTag

The desired behaviour is that when a user clicks on an item in the side menu, the list on page "notifications" is filtered for the objects which are set to that tag_id.

I've created the filter using your wizard, resulting in the following code:

code
define( [ 'require' ], function( ){
/**
* Read more about AngularJS filters in official docs:
* https://docs.angularjs.org/guide/filter
*/
function func(){

Code: Select all

     function filterFunction(input) { 
         //filter function body 

        &#47;&#47; HERE!!!!!!! <!----------------------------------- 
        &#47;&#47; Code will loop through notifications, compare the tag_ids 
        &#47;&#47; and return the subset of items 
        &#47;&#47; HERE!!!!!!! <!----------------------------------- 

     } 
     &#47;&#47;filterFunction&#46;$stateful = true; &#47;&#47;If true, filter will be executed during the each $digest cycle (stateful filter) 
     return filterFunction; 
 } 

 return [{ 
     /* type of angular resource */ 
     name: 'filterNotificationsByTag', 
     /* name for angular resource */ 
     type: 'filter', 
     /* angular dependency injection array */ 
     deps: [func] 
 }]; 

})/code

How do I get the tag_id from the side menu, into the filter function? I've been trying different approaches over the last few days, with no luck.

Regards,
Andy

[Andrew Peacock]

Wow, that was painful, but I got there eventually.

Change the final return value to:
code
return [{
/* type of angular resource /
name: 'filterNotificationsByTag',
/ name for angular resource /
type: 'filter',
/ angular dependency injection array */
deps: ['Apperyio', func]
}];
/code

then within the filterFunction, you can use ApperyIO like this:

tag_id = Apperyio.Config.get("filter_tag_id", -1);

I then just used:

tag_id = Apperyio.Config.get("filter_tag_id",xxx);

in the click event for the sidemenu list item.

Hope that makes sense!

Andy

[Andrew Peacock]

One more hint: in the example above,

tag_id = Apperyio.Config.get("filter_tag_id", -1);

returns a string, not an integer, even though the initial Config.set was an integer

Remember to parseInt(tag_id) if you need an integer.

Andy

[Evgene Karachevtsev]

Hello Andrew,

Thank you for sharing this.