Предоставить услугу в Angular5 = "не является функцией"

Я хочу переопределить службу из другого модуля, но я получил ошибку "не является функцией"

В моем компоненте (модуль 1) я ввожу услугу

public constructor(private chartProgressService: ChartProgressService) {
}

В модуле 2 я переопределяю сервер в провайдерах

providers: [
    {
        provide: Configuration,
        useClass: AppConfiguration,
    },
    {
        provide: ChartProgressService,
        useValue: MyChartProgressService
    },
    {
        provide: LOCALE_ID,
        useValue: 'de-DE',
    }
],

и это MyChartProgressService

import {Injectable} from '@angular/core';

@Injectable()
export class InnogyChartProgressService {

    public getUnit(): string {
        return '';
    }

    public getValue(currentValue: number, maxValue: number): number {
        return currentValue;
    }
}

Вызов this.chartProgressService.getValue() в моем компоненте возвращает ошибку

HeaderComponent.html:11 ERROR TypeError: this.chartProgressService.getUnit is not a function
at ChartProgressComponent.ngOnInit (chart-progress.component.ts:33)
at checkAndUpdateDirectiveInline (core.js:12369)
at checkAndUpdateNodeInline (core.js:13893)
at checkAndUpdateNode (core.js:13836)
at debugCheckAndUpdateNode (core.js:14729)
at debugCheckDirectivesFn (core.js:14670)
at Object.eval [as updateDirectives] (HeaderComponent.html:11)
at Object.debugUpdateDirectives [as updateDirectives] (core.js:14655)
at checkAndUpdateView (core.js:13802)
at callViewAction (core.js:14153)

Я думаю, что мне нужна твоя помощь! Спасибо!

3 ответа

Решение

Еще одна вещь, если вы хотите использовать InnogyChartProgressService

import {Injectable} from '@angular/core';

@Injectable()
export class InnogyChartProgressService {
}

тогда должно быть как

 {
    provide: ChartProgressService,
    useClass: InnogyChartProgressService 
},

в вашем случае вы имеете в виду другой класс под названием MyChartProgressService и измените useClass


Согласно угловой инструкции, если вы хотите заменить обслуживание новой услугой, чем вам нужно продлить обслуживание, например, приведенное в угловой инструкции

Для этого замените старый Logger на новый.

[{ provide: Logger, useClass: BetterLogger }]

он расширяет старый в новый, как показано ниже

@Injectable()
export class EvenBetterLogger extends Logger {
}

Читайте: https://angular.io/guide/dependency-injection

{предоставить: ChartProgressService, useClass: MyChartProgressService}

Проблема на самом деле была следующая: если вы используете useValue в определениях ваших провайдеров, вы должны использовать фактический экземпляр там, как new MyChartProgressService() или буквальный объект. Но если вы хотите просто дать "план" и позволить Angular создавать его автоматически, используйте useClass с типом, так что в вашем случае useClass: MyChartProgressService,

Более подробное объяснение можно найти в этом вопросе.

Другие вопросы по тегам