Angular2 - 使用依赖注入外组件

在我的应用我使用DI通过关于UserLogged信息需要这样的信息在不同的组件周围。这意味着我有一个main.ts类这样Angular2 - 使用依赖注入外组件

import {AppComponent} from './app.component'; 
import {UserLogged} from './userLogged' 

bootstrap(AppComponent, [UserLogged]);

，并需要使用的UserLogged实例的部件有这样

constructor(private _user: UserLogged)

构造现在我想使用相同的实例的UserLogged也在简单的TypeScript类（它不是@Component）。这可能吗？换句话说，如果我在@Component之外，是否也可以获得由DI注入的UserLogged的相同实例？

来源

2016-04-07 Picci

该构造也适用于服务（由DI创建其他类）

bootstrap(AppComponent, [OtherClass, UserLoggged]); 

@Injectable() 
export class UserLogged { 
    log(text) { 
    console.log(text); 
    } 
} 

@Injectable() 
export class OtherClass { 
    constructor(private _user: UserLogged) {} 
} 

class SomeComponent { 
    constructor(private otherClass:OtherClass) { 
    this.otherClass._user.log('xxx'); 
    } 
}

，如果您使用new SomeClass()这些类，那么你可以像

class SomeComponent { 
    constructor(private _injector:Injector) { 
    let userLog = this._injector.get(UserLogged); 
    new SomeClass(userLog); 
    } 
}

来源

2016-04-07 08:06:58

为了能够注入它在需要装饰器的类中使用依赖注入，即@Injectable之一。

@Injectable() 
export class SomeClass { 
    constructor(private dep:SomeDependency) { 
    } 
}

名称Injectable并不是真正的自我解释。这是为了在课堂上注入（而不是在另一课堂）。

提供商为SomeDependency类必须是可见的从发起呼叫的组件。

请参阅有关依赖注入更多的细节和层次注射器这个问题：

What's the best way to inject one service into another in angular 2 (Beta)?

来源

2016-04-07 08:07:33

林瞎猜在这里，但你的意思是说要注入的类必须使用providers : [UserLogged]？如果是这样的话，这将工作

providers: [ provide(UserLogged, {useClass: UserLogged} ]

添加上面你的引导，你是好去当你不想使用@Component'

sample.ts

export class Sample{ 
    constructor(private ulog : UserLogged){} 
}

在你的情况下，自举是：

import {provide} from 'angular2/core'; 
import {HTTP_PROVIDERS} from 'angular2/http'; 
bootstrap(AppComponent,[HTTP_PROVIDERS,provide(UserLogged, { useClass : UserLogged})]);

伊夫加HTTP_PROVIDERS演示如何添加多个提供程序。干杯！

来源

2016-04-07 11:25:50

在你引导角文件：

import { AppComponent } from './app.component'; 
import { UserLogged } from './userLogged'; 

declare global { 
    var injector: Injector; 
} 

bootstrap(AppComponent, [UserLogged]).then((appRef) => { 
    injector = appRef.injector; 
});

在你的其他的文件：

import { UserLogged } from '../path/to/userLogged'; 

class TestClass { 
    private userLogged: UserLogged; 

    constructor() { 
     this.userLogged = injector.get(UserLogged); 
    } 
}

来源

2017-03-14 20:09:38

Angular2 - 使用依赖注入外组件

回答

相关问题