Токен впрыска не определен в сервисе, но найден в компоненте - PullRequest
Новая
       16

Токен впрыска не определен в сервисе, но найден в компоненте

0 голосов
/ 27 марта 2019

Я добавляю внешние js библиотеки как InjectionTokens в приложение Angular 7, чтобы использовать их в @Components и сервисах. Я создал интерфейс InjectionToken<> и Provider и добавил Provider к свойству providers: [] @NgModule.

Я следовал этому руководству о том, как внедрить сторонние библиотеки.

Когда я внедряю InjectionToken в компонент, я могу использовать его на отлично. Когда я пытаюсь внедрить его в сервис, я получаю ошибку ... is not defined.

angular.json: 

[...]

"scripts": [
    "./node_modules/hot-formula-parser/dist/formula-parser.js",
    "./node_modules/@handsontable/formulajs/dist/formula.js"
]

[...]

entry.module.ts 

import { NgModule, InjectionToken } from '@angular/core';
import { CommonModule } from '@angular/common';
import { EntryComponent } from './entry.component';
import { RouterModule } from '@angular/router';
import { entryRoutes } from './entry.routes';
import { SharedModule } from 'src/shared/shared.module';
import { EntryService } from './entry.service';
import { HotParserProvider} from './parser/parser.injector';

@NgModule({
    declarations: [EntryComponent],
    imports: [SharedModule, CommonModule, RouterModule.forChild(entryRoutes)],
    exports: [],
    providers: [
        HotParserProvider,
        EntryService, 
    ],
})
export class EntryModule { }

parser.injector.ts: 

import { InjectionToken, ValueProvider } from "@angular/core";

interface IHotParser {
    parse: (formula: string) => {error:string, result: any};
}

const HotParser: InjectionToken<IHotParser> = new InjectionToken<IHotParser>('HotParser');

const HotParserProvider: ValueProvider = {
    provide: HotParser,
    useValue: new window['formulaParser'].Parser()
}

export {IHotParser, HotParser, HotParserProvider};

entry.component.ts 

import { Component, Inject } from '@angular/core';
import { EntryService } from './entry.service';
import { HotParser, IHotParser } from './parser/parser.injector';

@Component({
    selector: 'tp-entry',
    templateUrl: './entry.component.html',
    styleUrls: ['./entry.component.css']
})
export class EntryComponent {
    constructor(
        @Inject(HotParser) private parser: IHotParser, // No error!
        private entryService:EntryService
    ) { }

    ngOnInit(): void {
        console.log(parser.parse("SUM(1,1)"); // Correct output!       
    }
}

entry.service.ts: 

import { Injectable, Inject } from '@angular/core';
import { IHotParser} from './parser/parser.injector';

@Injectable()
export class EntryService {
    constructor(
        @Inject(HotParser) private parser: IHotParser // HotParser is not defined
    ) { }

Есть ли разница между введением токена в компонент и службу? Я попытался изменить порядок в модуле provider-array, но безрезультатно ...

1 Ответ

1 голос
/ 27 марта 2019

Nevermind. Код Visual Studio * Задержка 1002 * не предупредила меня о том, что HotParser не было импортировано в операторе import службы ... Я увидел следующую ошибку компилятора: 

ERROR in src/entry/entry.service.ts(11,25): error TS2304: Cannot find name 'HotParser'.

Так что в итоге изменилось: 

import { IHotParser } from './parser/parser.injector';

до: 

import { HotParser, IHotParser } from './parser/parser.injector';

И ошибка ушла.

...