Я прочитал эту статью и посмотрел эти видео о внедрении зависимостей в Angular 2:

И вполне понимаю про DI в Angular. Но я не понимаю, как это правильно использовать.

Мой вопрос в том, когда использовать определение типа (1) следующим образом:

import { Component } from '@angular/core';
import { Http } from '@angular/http';
@Component({
    selector: 'example-component',
    template: '<div>I am a component</div>'
})
class ExampleComponent {
    constructor(private http: Http) {}
}

А когда использовать Injector (2) вот так:

import { Injector, provide } from 'angular2/core'
var injector = Injector.resolveAndCreate(
[
provide(SomeObj, {useClass: SomeObj})
]);

Второй сбивает меня с толку, поскольку я не уверен, куда он должен идти (компонент, служба или что-то еще?), Как его использовать?

2
looooongname 24 Ноя 2017 в 07:11

1 ответ

Лучший ответ

Прежде всего следует отметить, что метод resolveAndCreate вызывается для ReflectiveInjector следующим образом (не Injector):

import { ReflectiveInjector } from '@angular/core';
const customInjector = ReflectiveInjector.resolveAndCreate( ... )

Во-вторых, ReflectiveInjector устарел в пользу StaticInjector. Подробнее об этом читайте в Angular не рекомендует ReflectiveInjector и представляет StaticInjector. Стоит ли вам заботиться?

Итак, теперь, если вы хотите создать собственный инжектор, вы должны использовать StaticInjector, можно сделать следующее:

import { HttpClient } from '@angular/common/http';
const customInjector = new StaticInjector([
    {provide: `MyCustomToken`, useValue: 'just a string value', deps: [HttpClient]}
])

Второй сбивает меня с толку, потому что я не уверен, куда он должен идти.

Пользовательские инжекторы, созданные с использованием отражающего или статического инжектора, могут быть переданы на фабрику модулей или компонентов при их создании. Вот несколько примеров из статьи Вот что вам нужно знать о динамических компонентах в Angular:

const customInjector = new StaticInjector( ... );

// module
this.loader.load('app/t.module#TModule').then((klass) => {
const factory = compiler.compileModuleSync(klass);
const module = factory.create(customInjector);

// dynamic component
const r = module.componentFactoryResolver;
const cmpFactory = r.resolveComponentFactory(AComponent);
const componentRef = cmpFactory.create(customInjector);
1
Max Koretskyi 24 Ноя 2017 в 06:05