指令缩小时未解决的依赖关系

时间:2017-05-04 13:02:50

标签: angularjs asp.net-mvc typescript

我有一个在应用程序未缩小时正在运行的指令

一旦我缩小它就会出现错误

Unknown provider: tProvider <- t <- dateTimeFilterDirective

有没有办法让指令在缩小时起作用?

module bundledAppModule {
'use strict';

export class ngDateTimeFilterDirective implements ng.IDirective {
    static $inject = ['$filter'];
    // static $inject = ['$scope', '$element', '$attrs', '$ngModel', '$filter'];
    public static className = 'dateTimeFilter';
    public restrict: string;
    public require: string;
    public priority: number;
    public link: ng.IDirectiveLinkFn;

    constructor($filter: ng.IFilterService) {
        this.restrict = 'A';
        this.require = 'ngModel';
        this.priority = 1;

        this.link = ($scope: ng.IScope, $element: JQuery, $attrs: any, $ngModel: ng.INgModelController) => {
            $ngModel.$formatters.push((modelValue) => {
                console.log('ngDateTimeFilterDirective', modelValue);


                return new Date($filter('date')(modelValue, 'medium'));
            });
        };
    }

    public static factory(): ng.IDirectiveFactory {
        var directive = ($filter: ng.IFilterService) => {
            return new ngDateTimeFilterDirective($filter);
        };
        return directive;
    }
};

}

修改

由于依赖$ filter:ng.IFilterService而发生错误。一旦我删除它所有的工作在缩小和未明确的版本。但我需要过滤器,并且不知道如何在缩小后使其工作。我知道我必须依赖2次控制器才能使它们在缩小后工作,所以我想我错过了那部分但是适应了指令。

这是堆栈跟踪 - 缩小:-) enter image description here

这是我使用该指令的方式。

<div ng-app="bundledApp" ng-controller="bundledController">
<input type="datetime-local" ng-model="someDate" date-time-filter />
{{someDate}}
<input type="button" ng-click="setDate();" value="changedate">
</div>

在应用初始化期间发生错误。当我点击一个按钮后,调用控制器动作,但没有命中指令(没有控制台日志消息)

1 个答案:

答案 0 :(得分:1)

$inject属性添加到实例化的指令函数:

public static factory(): ng.IDirectiveFactory {
    var directive = ($filter: ng.IFilterService) => {
        return new ngDateTimeFilterDirective($filter);
    };
    //INJECT $filter dependence
    directive.$inject = ['$filter'];
    return directive;
}