微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

在这两个场景中有点困惑,我们使用@Injectable()装饰器标记一些类,以便它们可用于注入不同的组件.我只是想知道@Inject()和构造函数注入之间的区别是正常的.

场景1 – 使用@Inject():

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

场景2 – 用作normal参数:

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

两种情况都有效,有什么区别吗?谁应该更优选?

解决方法

你真的应该只在注入令牌不是类的情况下使用@Inject.如果您不熟悉令牌是什么,它基本上是Angular用来识别要注入的内容.例如

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

这里我们有两个不同的提供者,AuthService和CustomHttpImpl.使用AuthService,令牌是AuthService.这意味着我们使用AuthService类型注入AuthService

constructor(private authService: AuthService) {}

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

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

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

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

所以你可以从中看出,令牌都是类,这足以让Angular知道如何注入.

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

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');

现在我们有我们要注入的项目的令牌.当我们配置提供者时,我们使用这些令牌,当我们注入时,我们@Inject(TOKEN)

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

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

UPDATE

现在,使用Angular 4,我们应该使用InjectionToken而不是Opaquetoken

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐