Как использовать заводского поставщика в угловом 2

Мне нужно ввести услугу в другую услугу в приложении angular 2. После прочтения документов я вывел, что лучший подход - использовать Factory Provider. Однако два вопроса возник:Как использовать заводского поставщика в угловом 2

1) Документы рекомендовать создание HeroServiceProvider класса с двумя «сегментами коды»:

let heroServiceFactory = (logger: Logger, userService: UserService) => { 
    return new HeroService(logger, userService.user.isAuthorized); 
}; 

export let heroServiceProvider = 
    { provide: HeroService, 
    useFactory: heroServiceFactory, 
    deps: [Logger, UserService] 
    };

Моим вопрос заключается в том, как следует класс вообще выглядит? Где можно добавить вышеперечисленные сегменты кода?

2) Как следует/можно использовать эту фабрику? Я вижу, его следует импортировать как:

import { heroServiceProvider } from './hero.service.provider'; 

@Component({ 
    selector: 'my-selector', 
    template: ` 
    `, 
    providers: [heroServiceProvider] 
})

Как можно получить желаемую параметризованную услугу и получить доступ?

источник

2016-10-01 arjacsoh

Путем инъекции HeroService, как и в случае любой другой услуги. –

Как сказал JB Nizet, почему бы вам просто не добавить его к своему конструктору, как любые другие инъекции? – echonax

Сегодня я столкнулся с тем же вопросом и нашел некоторое решение.

1) Я нашел точный код в angular.io, см. Ниже: https://github.com/angular/angular.io/blob/master/public/docs/_examples/dependency-injection/ts/src/app/heroes/hero.service.provider.ts (ссылка обновлена 15 мар 2017).
От этого кода heroServiceProvider не нужно быть классом.

2) В app.module.ts есть свойство провайдеров в @NgModule. И вы можете добавить heroServiceProvider в этом, как следующее:

import { heroServiceProvider } from './hero.service.provider'; 

... 

@NgModule({ 

    ... 

    providers: [ 
    heroServiceProvider 
    ], 
    bootstrap: [ AppComponent ] 
})

Предоставляя услуги в @NgModule, как это, вы можете воспользоваться услугой в области приложения.

источник

2017-01-26 12:50:58 mgmg

У меня нет достаточно очков, чтобы комментировать от ответа @mgmg «s, но вот некоторая полезная информация ...

Я использовал шаблон поставщика фабрики, приведенный в документации (и предмет этого вопроса) в моем собственное приложение, но продолжал получать ошибку при составлении

ERROR in Error encountered resolving symbol values statically. Function calls are not supported. Consider replacing the function or lambda with a reference to an exported function...

по существу, когда завод зависимости используются в корневом модуле, все это зависимости должны быть обеспечены с ним.

Это означает, что блок кода, приведенный в @mgmg «s ответа должна строго иметь зависимые службы

import { heroServiceProvider } from './hero.service.provider'; 
import { UserService } from './user.service'; 
import { Logger }  from './logger.service'; 

... 

@NgModule({ 

    ... 

    providers: [ 
    Logger, 
    UserService, 
    heroServiceProvider 
    // Wrapper for: 
    //{ provide: HeroService, 
    // useFactory: (logger: Logger, userService: UserService) => { 
    // return new HeroService(logger, userService.user.isAuthorized) 
    // }, 
    // deps: [Logger, UserService] 
    //}; 

    ], 
    bootstrap: [ AppComponent ] 
})

Примечания, в угловых Docs here, heroServiceProvider предоставляется в heroes.component не в приложения .module, и ссылки на Logger и UserService там не нужны. Я предполагаю, что эти две зависимости берутся из дерева инжектора.

источник

2017-03-15 06:32:41

Я согласен: у меня такая же ошибка: «ERROR in Error столкнулся с разрешающим символом ....» И я нашел решение: useFactory: (heroServiceFactory). просто добавьте() вокруг фабрики. – Reinhard

1) Первая часть Вашего вопроса проста: вы просто держать фрагмент кода вы предоставили в отдельный файл и импортировать его в компоненте, как показано на ваш вопрос:

import { heroServiceProvider } from './hero.service.provider';

2) для фактического использования вам не нужно изменять код, связанный с сервисом, в компоненте. Просто продолжайте использовать его, если первоначальная служба была введена. Вам даже не нужно изменять конструктор компонента.Идея поставщика услуг заключается в том, что вы можете настроить свою услугу на основе каждого компонента с помощью специализированного поставщика услуг для каждого компонента, и вы будете выполнять инициализацию, зависящую от компонента, в заводской функции. Просто не забудьте перечислить своего поставщика услуг в декораторе вашего компонента, Angular заботится об остальном «автоматически».

источник

2017-04-02 07:18:21

Я столкнулся с теми же проблемами, которые нужно было ввести в app_initalizer, после долгого поиска я нашел решение ниже. Возможно, это поможет вашему сценарию.

@NgModule({ 
    imports: [ BrowserModule], 
    ... 
    providers: [ 
    { 
     provide: HeroService, 
     useFactory: heroServiceFactory, 
     deps: [Logger, UserService], 
     multi: true 
    } 
    ] 
}) 
export class AppModule {} 


export function heroServiceFactory = (logger: Logger, userService: UserService) => { 
    return new HeroService(logger, userService.user.isAuthorized); 
};

источник

2017-05-29 07:45:05

Как использовать заводского поставщика в угловом 2

ответ

Смежные вопросы