使用VS 2013在Typescript中装饰AngularExceptionHandler服务

Question

Using Typescript and Visual Studio 2013

I want to decorate the angularjs $exceptionHandler and I'm not quite sure of the correct way to do it. I have decorated $log and it works fine.

My configuration:

MyAngularModule.config(['$provide',($provide) => {
    $provide.decorator('$log', ['$delegate', function ($delegate) {
        var myLog: MyLogService.LogService = new MyLogService.LogService();
        return myLog;
    }]);
}]);

MyLogService.ts

export = Example;
module Example {
    export class LogService implements ng.ILogService{ 
        constructor() {}
        public assertEmpty = () => { };
        public reset = () => { };
        public info: ng.ILogCall = ...all my code...
    }
}

Now when I try doing a similar thing with $exceptionHandler:

$provide.decorator('$log', ['$delegate', function ($delegate) {
        var myExHandler: MyExHandler.ExHandlerService = new MyExHandler.ExHandlerService();
        return myExHandler;
    }]);

The interface definition for exceptionHandler in the type files is:

interface IExceptionHandlerService {
    (exception: Error, cause?: string): void;
}   

How do I code this similar to the way I did in decorating the log service?

I tried:

export = Example;
module Example {
    export class ExHandlerService implements ng.IExceptionHandlerService{ 
        constructor(anException: Error, aCause?: string) {}

    }
}

And Visual Studio is complaining that the interface is implemented wrong. I don't really understand what (exception: Error, cause?: string): void; means, is it the constructor? The typings file does show a name, just this anonymous method definition.

I don't understand how I even approach this in the decorate call (ie. where do the error and cause parameters come from and how do I keep the default implementation operating as well?)

Thanks in advance.

Update :

Considering in angular.d.ts:

interface IExceptionHandlerService {
    (exception: Error, cause?: string): void;
}

I guess my root confusion is how this interface would be implemented in Typescript??

Ok, I found that interfaces can define a function type in this case. That created confusion with the way I have viewed interfaces typically. It seems I can't use an "implements" in this case?

Answer 1

I think I've found my own answer. In any case here is how I decorated the angular exception handler service in Typescript.

export class MyExceptionHandlerService { 


    private _defaultExceptionHandlerService: ng.IExceptionHandlerService;


    constructor(paramDelegate: ng.IExceptionHandlerService) {

        this._defaultExceptionHandlerService = paramDelegate;
    }

    public exception: ng.IExceptionHandlerService = (paramException: Error, paramCause?: string): void => {

        console.error("MY ERROR HANDLER: " + paramException.message)

        this._defaultExceptionHandlerService(paramException, paramCause);

    }



}

And I use it from my angular config section like this:

$provide.decorator('$exceptionHandler', ['$delegate', function ($delegate: ng.IExceptionHandlerService) {


                var localExceptionHandler: MyHandler.ExceptionHandlerService = new MyHandler.ExceptionHandlerService($delegate);

                return localExceptionHandler.exception;
            }]);

It's working as expected for me.

Answer 2

You could have also done something like this without using objects...not sure if this is good or not. Feedback would be awesome!

((): void => {
    'use strict';

    angular
        .module('app.blocks')
        .config(config);

    config.$inject = ['$provide'];

    function config($provide: ng.auto.IProvideService): void {
        $provide.decorator('$exceptionHandler', extendExceptionHandler);
    }

    extendExceptionHandler.$inject = ['$delegate', 'app.blocks.logger'];
    function extendExceptionHandler(
        $delegate: any,
        logger: app.blocks.ILogFactory): Function {

        return (exception: Error, cause?: string, source? : string) => {
            $delegate(exception, cause);
            logger.log(exception.message, { exception: exception, cause: cause }, source, 'error');
        }
    }
})();