Delving into the realm of translating Angular to Typescript for the first time has been quite a journey. While I am drawn to the benefits that Typescript offers, I must confess that integrating TS with Angular has proven to be challenging. Take a look at this code snippet:
module logger {
exceptionHandlerProvider.$inject = ["$injector"]
function exceptionHandlerProvider($injector, exception:any, cause:any) {
return function(exception: any, cause: any) {
var $http = $injector.get('$http');
var alertService = $injector.get('alertService');
$http({
url: '/api/log/',
method: 'POST',
data: $.param({
exception: exception,
cause: cause,
apiRequest: true
}),
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).error(function(data) {
alertService.addAlert({ msg: exception, type: 'error' });
console.log(exception);
});
};
}
angular.module('logger').factory('$exceptionHandler', exceptionHandlerProvider);
}
While the functionality is there, it feels like I'm merely wrapping my Angular code within a module rather than truly harnessing the power of Typescript. My struggle lies in transitioning from the function notation of Angular to the Class syntax of Typescript. Despite numerous attempts, I keep encountering issues such as circular dependencies, incorrect return types, and injector errors.
My latest attempt involves:
module logger {
export class $exceptionHandlerProvider {
http: ng.IHttpService;
alertService: services.AlertService;
constructor(Http: ng.IHttpService, AlertService: services.AlertService, exception: any, cause: any){
this.http = Http;
this.alertService = AlertService;
return this.$exceptionHandler(exception, cause);
}
public $exceptionHandler (exception:any, cause:any) {
return function(exception: any, cause: any) {
this.http({
url: '/api/log/',
method: 'POST',
data: $.param({
exception: exception,
cause: cause,
apiRequest: true
}),
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).error(data => {
this.alertService.addAlert({ msg: exception, type: 'error' });
console.log(exception);
});
};
}
}
}
If anyone could point me towards valuable resources for navigating Angular in Typescript or assist in refining this translation to Typescript, I would greatly appreciate it.