Хранение экземпляра инжектора для использования в компонентах
Перед RC5 я использовал инкремент appref в качестве локатора сервисов следующим образом:
Startup.ts
bootstrap(...) .then((appRef: any) => { ServiceLocator.injector = appRef.injector; }); ServiceLocator.ts
- Угловой 2 «Компонент-имя» кармы не является известным элементом
- Angularjs2 - предварительная конфигурация сервера перед запуском приложения
- Как определить изменение маршрута в Угловом?
- Маршрут Angular 2's Router нарушен при использовании маршрутов HTML5?
- Угловая 2 | Директивы Аргумент типа '{}' не присваивается
export class ServiceLocator { static injector: Injector; }
компоненты:
let myServiceInstance = ServiceLocator.injector.get(MyService)
Теперь выполняем то же самое в bootstrapModule (). Then () не работает, потому что компоненты, похоже, начинают выполняться перед promiseм.
Есть ли способ сохранить экземпляр инжектора перед загрузкой компонентов?
Я не хочу использовать инъекцию конструктора, потому что я использую инжектор в базовом компоненте, который был получен многими компонентами, и я скорее не добавляю инжектор ко всем из них.
- Angular2 - как вызвать функцию компонента извне приложения
- Угловая 2 внутренняяHTML (щелчок) привязка
- Угловая загрузка файла
- Ошибка установки углового с использованием npm из-за необходимости использовать строку
- Угловое - использование труб в услугах и компонентах
- Как передать данные на угловые маршрутизаторы?
- Угловой 2 - Ng Для использования чисел вместо коллекций
- Как я могу ограничить повторение ngFor некоторым количеством элементов в Angular?
Для сегодняшнего TypeScript и Angular 5, избегая WARNING in Circular dependency detected при импорте глобального инжектора, сначала объявите помощника, например app-injector.ts :
import {Injector} from '@angular/core'; /** * Allows for retrieving singletons using `AppInjector.get(MyService)` (whereas * `ReflectiveInjector.resolveAndCreate(MyService)` would create a new instance * of the service). */ export let AppInjector: Injector; /** * Helper to set the exported {@link AppInjector}, needed as ES6 modules export * immutable bindings (see http://2ality.com/2015/07/es6-module-exports.html) for * which trying to make changes after using `import {AppInjector}` would throw: * "TS2539: Cannot assign to 'AppInjector' because it is not a variable". */ export function setAppInjector(injector: Injector) { if (AppInjector) { // Should not happen console.error('Programming error: AppInjector was already set'); } else { AppInjector = injector; } }
Затем, в AppModule , установите его, используя:
import {Injector} from '@angular/core'; import {setAppInjector} from './app-injector'; export class AppModule { constructor(injector: Injector) { setAppInjector(injector); } }
И везде, где это необходимо, используйте:
import {AppInjector} from './app-injector'; const myService = AppInjector.get(MyService);
Мне удалось это сделать, используя ручную развертку. Не используйте объявление « bootstrap: [AppComponent] » в @NgModule , вместо этого используйте метод ngDoBootstrap :
export class AppModule { constructor(private injector: Injector) { } ngDoBootstrap(applicationRef: ApplicationRef) { ServiceLocator.injector = this.injector; applicationRef.bootstrap(AppComponent); } }
Другое решение с угловым итогом 2.0.0:
platformBrowserDynamic().bootstrapModule(AppModule, [ { defaultEncapsulation: ViewEncapsulation.Emulated, providers: [ { provide: TRANSLATIONS, useValue: TRANSLATION }, { provide: TRANSLATIONS_FORMAT, useValue: 'xlf' }, { provide: LOCALE_ID, useValue: 'fr' } ] } ]).then((modref: NgModuleRef) => { appInjector(modref.injector); });