@Inject与构造函数注入作为Angular 2中的常规参数有什么区别?

问题描述

在这两种情况下，我有点困惑，我们用@Injectable()装饰器标记某些类，以便它们可用于注入到不同的组件.我只想知道 @Inject()和构造方法注入的正常区别是什么.

I'm little bit confused in this two scenarios, we mark some classes with @Injectable() decorator so that they become available for injection to different components. I just want to know What is the difference between @Inject() and constructor injection as normal.

方案1-使用@Inject():

@Component({
    selector: 'main-app',
    template: `
        ....
        {{_service.getName()}}
        ....
    `
})
export class AppComponent{
    constructor(@Inject(AppService) private _service){}
    ....
}

方案2-用作普通参数:

@Component({
    selector: 'main-app',
    template: `
        ....
        {{_service.getName()}}
    `
})
export class AppComponent{
    constructor(private _service:AppService){}
    ....
}

两种情况都可行，有什么区别吗?哪一个更可取?

Both scenarios are working, is there any difference ? which one should is more preferable ?

推荐答案

在可注入的 token 不是类的情况下，您实际上仅应使用@Inject.如果您不了解令牌是什么，那么基本上它就是Angular用来识别要注入什么的.例如

You really should only use @Inject for situations where the injectable token is not a class. If you are unfamiliar with what a token is, it is basically what Angular uses to recognize what to inject. For example

providers: [
  AuthService,
  { provide: Http, useValue: new CustomHttpImpl() }
]

在这里，我们有两个不同的提供程序，AuthService和CustomHttpImpl.对于AuthService，令牌为AuthService.这意味着我们显然使用AuthService类型注入AuthService

Here we have two different providers, the AuthService and the CustomHttpImpl. With the AuthService the token is AuthService. This means that we inject AuthService, using obviously the AuthService type

constructor(private authService: AuthService) {}

使用此构造函数，Angular知道要使用令牌AuthService查找AuthService.

With this constructor, Angular knows to look for the AuthService with the token AuthService.

在第二个提供程序中，我们提供了CustomHttpImpl，但是这次我们使用令牌Http.因此，我们不能注入CustomHttpImpl，我们需要注入Http，因为那是令牌

In the second provider, we provide a CustomHttpImpl but this time we use the token Http. So we cannot inject CustomHttpImpl we need to inject Http, since that is the token

// this will actually be the CustomHttpImpl, not Angular's Http
constructor(private http: Http)

// error: No provider for CustomHttpImpl
constructor(private http: CustomHttpImpl)

因此您可以从中得知令牌是所有类，这足以使Angular找出如何注入.

So you can tell from this that the tokens are all classes, which is enough for Angular to figure out to how to inject.

但是，假设我们有一个String或一个我们想注入的东西的数组.我们不能将其绑定到任何类令牌，因此我们需要创建一个人工令牌

But let's say we have a String, or an Array of something we want to inject. We can't tie that to any class token, so we need to create an artificial token

import { OpaqueToken } from '@angular/core';

let numbers = [ 1, 2, 3, 4 ];
let config = '{ "some": "json", "config": "data" }'

const NUMBERS = new OpaqueToken('app.numbers');
const CONFIG = new OpaqueToken('app.config');

现在，我们有了要注入的物品的代币.当配置providers时，我们使用这些标记，而在注入时，我们@Inject(TOKEN)

Now we have tokens for the items we want to inject. When we configure the providers, we use those tokens, and when we inject, we @Inject(TOKEN)

providers: [
  { provide: NUMBERS, useValue: numbers },
  { provide: CONFIG, useValue: config }
]

constructor(@Inject(NUMBERS) numbers: number[], @Inject(CONFIG) config: string)

---

更新

现在，对于Angular 4，我们应该使用InjectionToken而不是OpaqueToken

---

UPDATE

Now, with Angular 4, we should use InjectionToken rather than OpaqueToken

这篇关于@Inject与构造函数注入作为Angular 2中的常规参数有什么区别?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！