inject translocoDecimalPipe into other pipe

254 Views Asked by At

I stumbled upon a problem while trying to inject TranslocoDecimalPipe into my custom pipe. The error I receive is either about something else or I do not understand it entirely.

Here is my service:

@Pipe({
  name: 'valueCurrency',
})
export class ValueCurrencyPipe implements PipeTransform {
  constructor(private readonly decimalPipe: TranslocoDecimalPipe) {}

  transform(value: number | Unset, currency?: string | Unset) {
    if (isNotSet(value)) {
      return '-';
    } else {
      const transformed = this.decimalPipe.transform(value, {
        minimumFractionDigits: 2,
        maximumFractionDigits: 3,
      });

      return `${defaultTo('', currency)} ${transformed}`.trim();
    }
  }
}

And here is the error Im getting:

main.ts:19 TypeError: Cannot read properties of null (reading 'type')
    at createViewRef (core.js:22954)
    at injectChangeDetectorRef (core.js:22934)
    at Module.ɵɵinjectPipeChangeDetectorRef (core.js:26655)
    at Object.TranslocoDecimalPipe_Factory [as factory] (ngneat-transloco-locale.js:1272)
    at R3Injector.hydrate (core.js:11452)
    at R3Injector.get (core.js:11272)
    at injectInjectorOnly (core.js:4776)
    at ɵɵinject (core.js:4780)
    at Module.ɵɵdirectiveInject (core.js:14704)
    at Object.ValueCurrencyPipe_Factory [as factory] (value-currency.pipe.ts:14)

The error seems to be centered around ChangeDetectorRef. My pipe is mostly used in templates all over the app, there is however one place (ngrx effect) where it is injected. That place may be the root cause, as I don't know if CDR is even available in StoreModules. (The module holding that effect has LocaleModule, with my custom pipe imported) I also tried to import CommonModule (the one that should provide CDR) there but it didn't help...

How can I proceed ?

0

There are 0 best solutions below