Нет поставщика услуг - Angular 7 - PullRequest
Новая
       13

Нет поставщика услуг - Angular 7

1 голос
/ 05 июня 2019

Я создал службу Singleton в Angular, которая выполняет вызовы API перед запуском приложения.Он работает на первой загруженной странице, но если я перехожу на другую страницу, он говорит:

Ошибка ОШИБКИ: Uncaught (в обещании): Ошибка: StaticInjectorError (AppModule) [MyComponent -> MyService]: StaticInjectorError (Платформа: core) [MyComponent -> MyService]: NullInjectorError: Нет провайдера для MyService!

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

My app.module.ts: 

providers: [
        MyService, {
            provide: APP_INITIALIZER,
            useFactory: (myService: MyService) => function () { return myService.load() },
            deps: [MyService],
            multi: true
        }]

My my.service.ts: 

@Injectable()
export class MyService {
...
}

Импорт в оба компонента: 

constructor(private myService: MyService) { }

Может кто-нибудь подсказать, пожалуйста, как это исправить?

Ответы [ 2 ]

2 голосов
/ 05 июня 2019

Я пытался воспроизвести вашу проблему, но она работает для меня. Пожалуйста, проверьте этот код. https://stackblitz.com/edit/angular-palz6c

import { NgModule, APP_INITIALIZER  } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';

import { AppComponent } from './app.component';
import { HelloComponent } from './hello.component';
import { MyServiceService } from './my-service.service';
import { TestComponent } from './test/test.component';

@NgModule({
  imports:      [ BrowserModule, FormsModule ],
  declarations: [ AppComponent, HelloComponent, TestComponent ],
  bootstrap:    [ AppComponent ],
  providers: [MyServiceService, {
            provide: APP_INITIALIZER,
            useFactory: (myService: MyServiceService) => function () { return myService.load() },
            deps: [MyServiceService],
            multi: true
        }]
})
export class AppModule { }

Услуги 

import { Injectable } from '@angular/core';
@Injectable()
export class MyServiceService {

  constructor() { }

  load() {

        // return new Promise<void>((resolve, reject) => {
        //     console.log("AppInitService.init() called");
        //     ////do your initialisation stuff here  
        //     setTimeout(() => {
        //         console.log('AppInitService Finished');
        //         resolve();
        //     }, 6000);

        // });
        console.log('AppInitService Finished');
    }

    test(val){
      console.log('test' + '-' + val);
    }
}

Компонент: 

import { Component, OnInit } from '@angular/core';
import { MyServiceService } from '../my-service.service'
@Component({
  selector: 'app-test',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {

  constructor(private service: MyServiceService) { 
    console.log(this.service.test('Test Component'));
  }

  ngOnInit() {
  }

}

Пожалуйста, дайте мне знать, если я что-то здесь упускаю.

0 голосов
/ 05 июня 2019

Попробуйте добавить к my.service.ts:

@Injectable({providedin 'root'})
...