angularjs - Angular 指令依赖注入(inject) - TypeScript

标签 angularjs typescript

似乎有很多方法可以在 TypeScript 中创建 Angular 指令。我见过的最简洁的方法是使用静态工厂函数:

module app {
    export class myDirective implements ng.IDirective {
        restrict: string = "E";
        replace: boolean = true;
        templateUrl: string = "my-directive.html";

        link: ng.IDirectiveLinkFn = (scope: ng.IScope, el: ng.IAugmentedJQuery, attrs: ng.IAttributes) => {
        };

        static factory(): ng.IDirectiveFactory {
            var directive: ng.IDirectiveFactory = () => new myDirective();
            return directive;
        }
    }

    angular.module("app")
        .directive("myDirective", myDirective.factory());
}

但如果我需要注入(inject)一些东西,我不确定该怎么做。假设我想要 $timeout:

module app {
    export class myDirective implements ng.IDirective {
        restrict: string = "E";
        replace: boolean = true;
        templateUrl: string = "my-directive.html";

        constructor(private $timeout: ng.ITimeoutService) {
        }

        link: ng.IDirectiveLinkFn = (scope: ng.IScope, el: ng.IAugmentedJQuery, attrs: ng.IAttributes) => {
            // using $timeout
             this.$timeout(function (): void {
             }, 2000);
        }

        static factory(): ng.IDirectiveFactory {
            var directive: ng.IDirectiveFactory = () => new myDirective(); // Uhoh! - What's goes here?
            directive.$inject = ["$timeout"];
            return directive;
        }
    }

    angular.module("app")
        .directive("myDirective", myDirective.factory());
}

正如您在上面看到的,我不确定如何调用 myDirective 构造函数并传入 $timeout。

最佳答案

只需将$timeout 指定为工厂构造函数参数并传递给它即可。

   static factory(): ng.IDirectiveFactory {
        var directive: ng.IDirectiveFactory = 
                       ($timeout:ng.ITimeoutService) => new myDirective($timeout); 
        directive.$inject = ["$timeout"];
        return directive;
    }

关于angularjs - Angular 指令依赖注入(inject) - TypeScript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30810607/

相关文章:

AngularJS:父范围未在指令(具有隔离范围)双向绑定(bind)中更新

javascript - 错误 TS2539 : Cannot assign to 'c' because it is not a variable

javascript - 通过切换功能对数字进行 Angular 排序

angular - 验证页面上的选择元素

javascript - 如何从 Angular 表单返回 Django?

javascript - 如何让 Protractor 不等待 $timeout?

typescript - 在 TypeScript 中定义数组类型

mysql - 发送数据库行列表(例如要在 Nodejs 中查看的对象)

sql - 如何使用动态数据库切换为单个grails Web应用程序创建多个URL

javascript - 如何设置 toLocaleString 的通用格式?