Qual é a diferença entre @Injecte e @Injectable no Angular 2 typescript

Question

Qual é a diferença entre @Injecte e @Injectable no Angular 2 typescript

Eu não entendo quando usar @Injecte e quando usar @Injectable ?

  import {Component, Inject, provide} from '@angular/core';
    import {Hamburger} from '../services/hamburger'; 
    export class App {
       bunType: string;
       constructor(@Inject(Hamburger) h) {
         this.bunType = h.bun.type;
       }
     }

E....

  import {Injectable} from '@angular/core';
    import {Bun} from './bun';
    @Injectable()
    export class Hamburger {
      constructor(public bun: Bun) {
      }
    }

5

dependency-injection angular typescript injectable

Author: Sarvesh Yadav, 2016-05-19

Source

2 answers

score 5 · Answer 1

O decorador @Injectable pretende realmente definir alguns metadados sobre quais dependências injectar no construtor da classe associada. É um decorador de classe que não requer parâmetros. Sem este decorador nenhuma dependência será injectada...

@Injectable()
export class SomeService {
  constructor(private http:Http) {
  }
}

O decorador @Inject deve ser utilizado ao nível dos parâmetros do construtor para especificar metadados relativos aos elementos a injectar. Sem ele, o tipo de parâmetros é usado (obj:SomeType é equivalente a @Inject(SomeType) obj).

@Injectable()
export class SomeService {
  constructor(@Inject(Http) private http:Http, @Inject('sometoken') obj) {
  }
}

score 1 · Answer 2

Deve ler esta diferença - @Injecte e @ Injectable

@Inject ()

É um mecanismo manual para deixar o Angular saber que um parâmetro deve ser injectado.

Ao utilizar o TypeScript, o @Injecte só é necessário para injectar primitivos. Por exemplo:

export class AppComponent {
  encryption = this.chatWidget.chatSocket.encryption;

  constructor(@Inject(ChatWidget) private chatWidget) { }
}

@Injectable ()

Permite que o Angular saiba que uma classe pode ser usada com a dependência injector.

Para eg:

@Injectable()
export class ChatWidget {
constructor(
    public authService: AuthService,
    public authWidget: AuthWidget,
    public chatSocket: ChatSocket) { }
}

No exemplo acima, o injector Angular determina o que injectar no construtor do ChatWidget usando a informação do tipo