Question

我的角度应用程序（typescript）中有一个自定义过滤器，如下所示：

namespace InterACT {
  export namespace Filters {
    export class ContractAppliedTo {
      public static onFilterApplied(contract: Interfaces.IReimbursementContract) {
        if (contract.services && contract.services.length > 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', () => { return InterACT.Filters.ContractAppliedTo.onFilterApplied; });

我可以在我的标记中使用此过滤器，就像其他内置过滤器一样：

{{rule | contractAppliedTo}}

我现在需要在控制器中使用此过滤器，并且正在努力如何引用它以供使用。

我已经在我的一些控制器中使用了角度日期过滤器，在这些控制器的构造函数中，我注入了ng.IFilterService并分配给私有变量以供以后使用。

namespace InterACT {
  export namespace Controllers {
    export class MyController {

      public static $inject = ['$filter'];
      constructor(
        private $filter: ng.IFilterService
            ) {
            }

            public someFunction = () => {
                let dateFilter = this.$filter('date'),
                    foo;

                foo = dateFilter('some-date-string', 'd-M-Y');
            }
        }
    }
}

当谈到使用我的ContractAppliedTo过滤器时，我无法让控制器识别它供我使用，或者我想我的意思是打字稿编译器不会选择它。

我想知道我是否可以使用过滤服务来获取新过滤器的实例，例如：

let contractAppliedTo = this.$filter('contractAppliedTo')

但是当我尝试使用它时，我收到一个打字稿错误说

[ts] Cannot invoke an expression whose type lacks a call signature. Type '{}' has no compatible call signatures.

我想我错过了一个界面，以便能够在我的控制器中使用这个过滤器。

有人可以进一步提出建议吗？

由于

Answer 1

此问题是FilterService无法找到自定义过滤器的呼叫签名。我通过导入自定义过滤器并使用type assertion来对付$filter服务的使用，从而解决了这个问题。

const contractAppliedTo: contractAppliedTo = 
      (<contractAppliedTo>this.$filter('contractAppliedTo'));

Angular Typescript - 在控制器内使用自定义过滤器

1 个答案: