How to use a filter in a controller

Question

I have written a filter function which will return data based on the argument you are passing  I want the same functionality in my controller  Is it possible to reuse the filter function in a controller    This is what I ve tried so far   function myCtrl  scope filter1            i simply used the filter function name  it is not working

User · Answer

Here s another example of using filter in an Angular controller    scope ListOfPeople           PersonID  10  FirstName   John   LastName   Smith   Sex   Male           PersonID  11  FirstName   James   LastName   Last   Sex   Male           PersonID  12  FirstName   Mary   LastName   Heart   Sex   Female           PersonID  13  FirstName   Sandra   LastName   Goldsmith   Sex   Female           PersonID  14  FirstName   Shaun   LastName   Sheep   Sex   Male           PersonID  15  FirstName   Nicola   LastName   Smith   Sex   Male         scope ListOfWomen    scope ListOfPeople filter function  person        return  person Sex     Female             This will display  There are 2 women in our list   prompt      There are      scope ListOfWomen length     women in our list       Simple  hey

User · Answer

There are three possible ways to do this   Let s assume you have the following simple filter  which converts a string to uppercase  with a parameter for the first character only   app filter  uppercase   function         return function string  firstCharOnly            return   firstCharOnly                string toUpperCase                 string charAt 0  toUpperCase     string slice 1                 Directly through  filter  app controller  MyController   function  filter            HELLO     var text    filter  uppercase    hello            Hello     var text    filter  uppercase    hello   true          Note  this gives you access to all your filters     Assign  filter to a variable  This option allows you to use the  filter like a function   app controller  MyController   function  filter         var uppercaseFilter    filter  uppercase            HELLO     var text   uppercaseFilter  hello            Hello     var text   uppercaseFilter  hello   true            Load only a specific Filter  You can load only a specific filter by appending the filter name with Filter   app controller  MyController   function uppercaseFilter            HELLO     var text   uppercaseFilter  hello            Hello     var text   uppercaseFilter  hello   true            Which one you use comes to personal preference  but I recommend using the third  because it s the most readable option

User · Answer

Inject  filter to your controller  function myCtrl  scope   filter        Then wherever you want to use that filter  just use it like this    filter  filtername      If you want to pass arguments to that filter  do it using separate parentheses   function myCtrl  scope   filter         filter  filtername   arg1 arg2       Where arg1 is the array you want to filter on and arg2 is the object used to filter

User · Answer

Answer provided by  Prashanth is correct  but there is even easier way of doing the same  Basically instead of injecting the  filter dependency and using awkward syntax of invoking it   filter  filtername   arg1 arg2    one can inject dependency being  filter name plus the Filter suffix    Taking example from the question one could write   function myCtrl  scope  filter1Filter       filter1Filter input  arg1       It should be noted that you must append Filter to the filter name  no matter what naming convention you re using  foo       is referenced by calling fooFilter fooFilter is referenced by calling fooFilterFilter

User · Answer

Using following sample code we can filter array in angular controller by name  this is based on following description  http   docs angularjs org guide filter this filteredArray   filterFilter this array   name  Igor     JS   angular module  FilterInControllerModule            controller  FilterController     filterFilter   function filterFilter          this array              name   Tobias             name   Jeff             name   Brian             name   Igor             name   James             name   Brad                  this filteredArray   filterFilter this array   name  Igor               HTML  lt  doctype html gt   lt html lang  quot en quot  gt   lt head gt     lt meta charset  quot UTF-8 quot  gt     lt title gt Example - example-example96-production lt  title gt         lt script src  quot   ajax googleapis com ajax libs angularjs 1 3 0-beta 3 angular min js quot  gt  lt  script gt     lt script src  quot script js quot  gt  lt  script gt          lt  head gt   lt body ng-app  quot FilterInControllerModule quot  gt       lt div ng-controller  quot FilterController as ctrl quot  gt       lt div gt        All entries         lt span ng-repeat  quot entry in ctrl array quot  gt   entry name    lt  span gt       lt  div gt       lt div gt        Filter By Name in angular controller        lt span ng-repeat  quot entry in ctrl filteredArray quot  gt   entry name    lt  span gt       lt  div gt     lt  div gt   lt  body gt   lt  html gt

User · Answer

First of all inject  filter to your controller  making sure ngSanitize is loaded within your app  later within the controller usage is as follows    filter  linky   text  target  attributes    Always check out the angularjs docs

User · Answer

There is another way to evaluate filters that mirrors the syntax from the views  The invocation is hairy but you could build a shortcut to it  I like that the syntax of the string is identical to what you d have in a view  Looks like this   function myCtrl  scope   interpolate        scope  eval  interpolate      myvar   10   currency    dollars

User · Answer

I have another example  that I made for my process   I get an Array with value-Description like this  states          status   1       desc    u2713           status   2       desc    u271B       in my Filters js    filter  getState   function          return function  input  states              console log states           for  var i   0  i  lt  states length  i                    console log states i                if  states i  status    input                    return states i  desc                                  return   u2718               Then  a test var  controller    function myCtrl  scope   filter                    var resp    filter  getState    1   states

User · Answer

AngularJs lets you to use filters inside template or inside Controller  Directive etc    in template you can use this syntax     variable   MyFilter                 and inside controller you can use injecting the  filter service  angular module  MyModule   controller  MyCtrl  function  scope   filter        filter  MyFilter   arg1  arg2        If you need more with Demo example here is a link  AngularJs filter examples and demo

User · Answer

function ngController  scope  filter        scope name    aaaa        scope age    32          scope result   function            return  filter  lowercase    scope name                 The controller method 2nd argument name should be   filter  then only the filter functionality will work with this example  In this example i have used the  lowercase  Filter

User · Answer

Simple date example using  filter in a controller would be   var myDate   new Date     scope dateAsString    filter  date   myDate   yyyy-MM-dd       As explained here - https   stackoverflow com a 20131782 262140

User · Answer

Reusing An Angular js Filter - View   Controller  This Solution is covering reusing Angular Filters   Which is yet another way to filter data  and Google landed me here when I needed such  and I like to share   Use Case  If you are already filtering  say in an ng-repeat in your view  as below   then you might have defined a filter in the controller as further follows   And then you can reuse as in the final examples   Filter Use Example - Filtered Repeat in View   lt div ng-app  someApp  ng-controller  someController  gt       lt h2 gt Duplicates lt  h2 gt       lt table class  table table-striped table-light table-bordered-light  gt           lt thead gt               lt tr gt                   lt th gt Name lt  th gt                   lt th gt Gender lt  th gt               lt  tr gt           lt  thead gt           lt tbody gt               lt tr ng-repeat  person in data   filter  searchDuplicate true  gt                   lt td gt   person name   lt  td gt                   lt td gt   person gender   lt  td gt               lt  tr gt           lt  tbody gt       lt  table gt   lt  div gt    Angular Filter Definition Example  angular module  someApp       controller  someController   function  scope   filter           scope people     name   Bob   gender   male     hasDuplicate  true                          name   Bob   gender   male     hasDuplicate  true                          name   Bob   gender   female   hasDuplicate  false          scope searchDuplicate     hasDuplicate   true         So  the concept here is that you are already using a filter created for your view  and then realize you would like to use it in your controller also   Filter Function Use Within Controller Example 1  var dup    filter  filter    scope people   scope searchDuplicate  true    Filter Function Use Within Controller Example 2  Show a Button only if no duplicates are found  using the prior filter   Html Button   lt div ng-if  showButton    gt  lt button class  btn btn-primary  ng-click  doSomething     gt  lt  button gt  lt  div gt    Show Hide Button   scope doSomething   function                  scope showButton   function    return  filter  filter    scope people   scope searchDuplicate  true  length    0       Some may find this version of filtering easy  and it is an Angular js option    The optional comparator parameter  true  used in the view and in the  filter function call specifies you want a strict comparison   If you omit  values can be searched for over multiple columns   https   docs angularjs org api ng filter filter

User · Answer

It seems nobody has mentioned that you can use a function as arg2 in  filter  filtername   arg1 arg2    For example     scope filteredItems    filter  filter   items  function item  return item Price gt 50

User · Answer

Use below code if we want to add multiple conditions  instead of single value in javascript angular filter   var modifiedArray    filter  filter   array function item  return  item ColumnName     Value1     item ColumnName     Value2     true

User · Answer

if you want to filter object in controller try this   var rateSelected    filter  filter    scope GradeList  function  obj                            if obj GradeId     scope contractor emp save modal data GradeId                          return obj                        This will return filtered object according to if condition

[angularjs] How to use a filter in a controller?

Examples related to angularjs

Examples related to angular-filters

Examples related to ng-controller