Angular2 - Использование зависимых инъекций вне компонентов

Question

В моем приложении я использую DI для передачи информации об UserLogged по различным компонентам, которым нужна такая информация. Это означает, что у меня есть main.ts класса, как этот

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

bootstrap(AppComponent, [UserLogged]); 

и компоненты, которые необходимо использовать экземпляр UserLogged есть конструктор, как этот

constructor(private _user: UserLogged) 

Теперь я хотел бы использовать тот же экземпляр UserLogged также в простых классах TypeScript (которые не являются @Component). Это возможно? Другими словами, могу ли я получить один и тот же экземпляр UserLogged, введенный DI, также если я за пределами @Component?

Answer 1

Этот конструктор также работает для услуг (другие классы, созданные 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); 
    } 
} 

Answer 2

Чтобы быть в состоянии используйте инъекцию зависимости в классах, в которой вам нужен декоратор, @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)?

Answer 3

Im принимая дикое предположение здесь, но вы хотите сказать, вы хотите Вводят класс с необходимо использовать 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})]); 

Ive добавил HTTP_PROVIDERS, чтобы продемонстрировать, как добавить нескольких поставщиков. Приветствия!

Answer 4

В файле, где используется при загрузке Угловая:

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