Valeur inattendue '[object Object]' importée par le module 'AppModule'.

Question

Je veux importer le module Pipe dans mon application,

import { NgModule } from '@angular/core';
import { PipeTransform, Pipe } from '@angular/core';

@Pipe({ name: 'values',  pure: false })
export class PipeModule implements PipeTransform {
  transform(value: any, args: any[] = null): any {
    return Object.keys(value).map(key => value[key]);
  }

  static forRoot() {
      return {
          ngModule: PipeModule,
          providers: [],
      };
   }
}

c'est mon module de tuyauterie

à mon app.module.ts

imports: [
   ...,
    PipeModule.forRoot()

Je l'importe comme ceci et j'obtiens cette erreur

Unexpected value '[object Object]' imported by the module 'AppModule

Answer 1

J'ai eu la même erreur (qui est très générique), mais pour une raison totalement différente.

Ma solution ne résoudra pas la question initiale, mais je l'écris quand même ici au cas où quelqu'un aurait le même problème :

Dans mes tests unitaires, j'ai accidentellement déclaré un fichier provider à l'intérieur de l'objet imports au lieu du tableau providers un. C'est ce qui causait le problème.

Answer 2

Votre classe PipeModule n'est pas décoré avec le @NgModule décorateur - il ne s'agit donc pas d'un module. Il ne peut donc pas être importé dans votre AppModule - seulement @NgModules sont autorisés à être importés.

Sur la base de ce que vous faites, votre premier exemple de code est juste la création d'un tuyau Angular standard, donc s'il vous plaît changer le nom de cette classe à quelque chose comme ValuesPipe donc ce n'est pas trompeur.

À ce stade, vous avez deux options : vous pouvez déclarer votre nouvelle ValuesPipe en AppModule ou vous pouvez créer une toute nouvelle NgModule pour stocker votre nouvelle ValuesPipe et ensuite importer cette nouvelle NgModule dans votre AppModule .

Veuillez noter que dans les deux options ci-dessous, j'ai supposé que vous avez renommé la classe de votre premier exemple en ValuesPipe .

donc, l'option 1 :

sur app.module.ts ,

declarations: [
  .....,
  ValuesPipe,
]

O Option 2 :

créer une nouvelle classe PipeModule On dirait :

@NgModule({
   imports: CommonModule,  (from @angular/core)
   declarations: ValuesPipe,
})
export class PipeModule { }

Et puis, en app.module.ts ,

imports: [
  ......,
  PipeModule
]