title: Angular Typescript - using a custom filter inside a controller
body: <p>I have a custom filter in my angular application (typescript) as below:</p>
  
  <pre><code>namespace InterACT {
    export namespace Filters {
      export class ContractAppliedTo {
        public static onFilterApplied(contract: Interfaces.IReimbursementContract) {
          if (contract.services &amp;&amp; contract.services.length &gt; 0) {
            return _.map(contract.services, 'regNumber').join(', ');
          } else if (contract.operator) {
            return contract.operator.name;
          }
          return contract.scheme.abbreviation;
        }
      }
    }
  }
  
  angular
    .module('app.settlement')
    .filter('contractAppliedTo', () =&gt; { return InterACT.Filters.ContractAppliedTo.onFilterApplied; });
  </code></pre>
  
  <p>I am able to use this filter just fine in my markup like other built in filters:</p>
  
  <pre><code>{{rule | contractAppliedTo}}
  </code></pre>
  
  <p>I now need to use this filter in a controller, and am struggling how to reference it for usage.</p>
  
  <p>I already use angular date filters in some of my controllers, and in the constructor of these, I am injecting in ng.IFilterService and assigning to a private variable for usage later on.</p>
  
  <pre><code>namespace InterACT {
    export namespace Controllers {
      export class MyController {
  
        public static $inject = ['$filter'];
        constructor(
          private $filter: ng.IFilterService
              ) {
              }
  
              public someFunction = () =&gt; {
                  let dateFilter = this.$filter('date'),
                      foo;
  
                  foo = dateFilter('some-date-string', 'd-M-Y');
              }
          }
      }
  }
  </code></pre>
  
  <p>When it comes to using my ContractAppliedTo filter, I can't get the controller to recognise it for me to use, or I guess what I mean is the typescript compiler wont pick it up.</p>
  
  <p>I wondered if I could use the filter service to grab an instance of my new filter, e.g:</p>
  
  <pre><code>let contractAppliedTo = this.$filter('contractAppliedTo')
  </code></pre>
  
  <p>But when I try to use it, I get a typescript error saying</p>
  
  <pre><code>[ts] Cannot invoke an expression whose type lacks a call signature. Type '{}' has no compatible call signatures.
  </code></pre>
  
  <p>I think I am missing an interface in order to be able to use this filter in my controller.</p>
  
  <p>Can someone advise further please?</p>
  
  <p>Thanks</p>