Question

尝试将angularjs'$filter服务注入到指令中，使用typescript：

export class MyDirective implements ng.IDirective {

        public static $inject: string[] = ["$filter"];

        constructor (public $filter: ng.IFilterService) {

          var result = this.$filter('orderBy')([{"price":1}], ["price"])

          return this;  
      }    

}

收到错误：

angular.js:11655 TypeError: this.$filter is not a function

为什么$filter未定义？

Answer 1

尝试：

+---------+---------+---------+------------------------------------------------------+
|        a|        b|        c|sum(CASE WHEN isnotnull(a) THEN 1 ELSE 0 AS sum_col#3)|
+---------+---------+---------+------------------------------------------------------+
|something|something|something|                                                     1|
|something|     null|something|                                                     1|
|     null|something|something|                                                     1|
+---------+---------+---------+------------------------------------------------------+

$ filter是构造函数的一个参数......它还不是你班级的成员。如果我替换了这个。$ filter＆＃39;通过＆＃39; $ filter＆＃39;它有效。

如果您想使用此。$过滤器，您需要将其添加到您的班级，并将该参数添加到该成员＆＃39; $ filter＆＃39;：

var result =$filter('orderBy')([{"price":1}], ["price"])

我更改构造函数中的参数以尝试澄清$ filterParameter。

我在github上提出了对完整代码的更改。如果有帮助，请告诉我们。

Answer 2

您可以将构造函数签名更改为

constructor (private $filter: ng.IFilterService) {

会自动使过滤器成为类属性而这个。从那时起，参考应该起作用。

Answer 3

确定。我刚刚通过以下重组完成了修复：https://github.com/dilumich/style_typescript_angularjs

删除了该行：public static $inject: string[] = ["$filter"];

将工厂添加到指令中：

 static factory(): ng.IDirectiveFactory { 
   var directive = (filterService: ng.IFilterService) => new OfferingsTableDirective(filterService); directive.$inject = ['$filter'];
 return directive; 
}

然后在我的示例应用中注册，如：

angular.module('app.directives').directive('offeringsTableDirective', OfferingsTableDirective.factory());

然后$ filter变得功能化 - 未定义。

TypeScript，Angularjs注入服务

3 个答案: