Service object wrongly typed for angular directive in Typescript

Question

Below is typescript for an angular directive. The problem is with the injected service "datacontext". The debugger shows that the datacontext in the constructor is a WINDOW object, not the datacontext object that was created as a service. Therefore, in the scope.viewRecord function, the datacontext.cancelChanges() function is, obviously, undefined - - as its not part of a WINDOW object This is probably some strange scoping issue that I just don't get, but I'm at a loss as to how to debug this. Any insight would be most appreciated. Thanks.

module app {
    export interface IEditButtonGroup {
        ...
    }

    export interface IEditButtonScope extends ng.IScope {
        ...
    }

    export class PrxEditButtonGroup implements IEditButtonGroup {
        public static $inject: Array<string> = [
            "datacontext"
        ];
        constructor(
            public datacontext: IDataContext, <---- datacontext HERE is typed as a WINDOW object
            public directive: ng.IDirective = {}) {
            directive.templateUrl = "app/directives/templates/editbuttongroup.html",
            directive.restrict = 'E';
            directive.link = (scope: IEditButtonScope, element, attr) => {
                scope.isEditing = false;
                scope.isAdding = false;

                $("form.disabled").find("input:not(:disabled), select:not(:disabled), textarea:not(:disabled)").prop("disabled", true);

                scope.editRecord = () => {
                    $("input, select, textarea").removeAttr("disabled");
                    scope.isEditing = true;
                    scope.afterEdit();
                }

                scope.viewRecord = (afterCancel: boolean) => {
                    datacontext.cancelChanges(); <--- HERE TOO!  Debugger says datacontext = WINDOW object
                    scope.isEditing = scope.isAdding = false;
                    $("form.disabled").find("input:not(:disabled), select:not(:disabled), textarea:not(:disabled)").prop("disabled", true);
                    scope.afterAdd();
                }
            }
            return <any>directive;
        }         
    }
}

Answer 1

The error seems to be at the place where you register this directive. Make sure it is like :

mymodule.directive('prxEditButtonGroup',app.PrxEditButtonGroup )