How to write Helper class in typescript? [duplicate]

Answer 1

Your Helper class corresponds to a service and since you want to inject another service in you need add the @Injectable decorator (not the @Component one):

Import {Injectable} from 'angular2/core';

@Injectable()
export class Helper {
  (...)
}

Since it's part of dependency injection, all parameters of its constructor will be provided by Angular2 itself. You don't need to provide them by your own and instantiate yourself this class to be able it. Simply inject it where you want to use it...

You need then to the corresponding provider at when bootstrapping your application:

bootstrap(AppComponent, [ Helper ]);

Or at a component level but can only be used within processing triggered by the component.

@Component({
  (...)
  providers: [ Helper ]
})
export class SomeComponent {
  (...)
}

For more details about dependency injection and hierarchical injectors, you could have a look at this question:

• No provider for ObservableDataService

Answer 2

First of all class Helper should be a service class HelperClass, which should be injectable.

import {Injectable} from "@angular/core";
import {Http} from "@angular/http";
import {TranslateService} from "ng2-translate";

@Injectable()
export class HelperService {
   constructor(private http: Http, private translateService: TranslateService) {

   }

}

Now you can simply inject this helper and use it in any component you like.

import {HelperService} from "./helper.service.ts";
@Component({
   ...
})
export class MyComponent{
   constructor(public helperService: HelperService) {}
}

Update: You need to add the service in providers array of the root module for it to work, or for angular6+, the service can be provided as follows

@Injectable({
  providedIn: 'root'
})
export class HelperService {
   ...
}

Answer 3

Helper classes should only contain static functions or variable, if not they are not different from services. Please Correct me if I'm mistaken.

One of ways to create Helper class without Injectable or adding it to providers is posted here Thanks to k7sleeper

Copying the code from the mentioned post for quick reference.

utils.ts :

export default class Utils {
    static doSomething(val: string) { return val; }
    static doSomethingElse(val: string) { return val; }
}

Usage:

import Utils from './utils'
export class MyClass {
    constructor()
    {
        Utils.doSomething("test");
    }
}

But reading more about this, it makes sense to inject them through Injectable and providers, but I would still have all the methods as static and the class without constructor