CODEWITHSUNDEEP
angularjstypescriptinterceptorangularjs-factory
uksz
uksz

Reputation: 18719

TypeScript + AngularJS v1: Rewriting angular factory to TypeScript

I am wondering how can I rewrite the following factory into a TypeScript code. Here is the original code: 

app.factory('errorInterceptor', function ($q) {
    return {
        responseError: function (response) {
            console.error("Error: " + response.statusText);
            return $q.reject(response);
        }
    }
});

So far I've tried the following:

 export class errorInterceptor {
    constructor(private $q:ng.IQService) {

    }

    public responseError(response:any){
        console.error("Error: " + response.statusText);

        return this.$q.reject(response);
    }

    public static getFactory(){
        return  errorInterceptor;
    }
}

app.factory('errorInterceptor',errorInterceptor.getFactory());

But I get the following error:

Provider 'errorInterceptor' must return a value from $get factory method.

Any ideas?

Upvotes: 6

Views: 295

Answers (2)

Shumik
Shumik

Reputation: 7

Use this core: https://github.com/aleksey-pastuhov/AngularJS-Typed-Core/blob/master/AngularJSTypedCore/Script/service.ts

@service(app)
export class UserRolesService {
static $inject: string[] = ["$cookies"];

private $cookies: angular.cookies.ICookiesService;

user: IUser;

GetUser(): IUser {
    return this.user;
}
}

Call:

this.userRolesService.GetUser()

Upvotes: -1

Radim Köhler
Radim Köhler

Reputation: 123881

I use this syntax:

export class errorInterceptor {
    // to support minification
    static $inject = ["$q"];

    constructor(private $q:ng.IQService) {

    }

    public responseError(response:any){
        console.error("Error: " + response.statusText);

        return this.$q.reject(response);
    }

    //public static getFactory(){
    //    return  errorInterceptor;
    //}
}

//app.factory('errorInterceptor',errorInterceptor.getFactory());
app.service('errorInterceptor',errorInterceptor);

EXTEND:

This is the snippet which I use to intercept $http calls (so it does work for me)

module MyModule
{
    var app = angular.module("MyModule");

    export class HttpErrorAspect
    {
        static $inject = ["$q"];

        constructor(private $q: ng.IQService)
        {
        }

        public responseError = (rejection: any): any =>
        {
            // do some magic, e.g. use toaster or alerter
            // to notify about the issue
            ...

            // reject that all
            return this.$q.reject(rejection);
        }
    }

    app.service("HttpErrorFilter", MyModule.HttpErrorAspect);
}

Upvotes: 2

Related Questions