web-dev-qa-db-fra.com

Problème lors de la configuration de la table d'échantillons. "Impossible de trouver le modèle de ligne correspondant pour rowModelType clientSide"

J'ai parcouru le tutoriel "Mise en route" pour l'ag-grid sur le nouveau projet. A terminé toutes les étapes mais a obtenu une erreur disant

ag-Grid: could not find matching row model for rowModelType clientSide
ag-Grid: Row Model "Client Side" not found. Please ensure the ClientSideRowModelModule is loaded using: import '@ag-grid-community/client-side-row-model';

J'ai comparé tout mon code avec des exemples fournis dans le tutoriel et quelques exemples de plunker, et je n'ai remarqué aucune différence. J'ai essayé d'importer ClientSideRowModelModule dans l'app.module mais les interfaces ne correspondaient pas à ce qui était angular demandé, donc cela n'a pas fonctionné. Je suis à court d'idées et je n'ai pas trouvé d'informations sur la façon de résoudre ce problème il.

app.module.ts:

    ... imports: [
    BrowserModule,
    AppRoutingModule,
    AgGridModule.withComponents([])
  ],...

app.cpmponent.html:

<ag-grid-angular 
style="width: 500px; height: 500px;" 
class="ag-theme-balham"
[rowData]="rowData" 
[columnDefs]="columnDefs"
 >
</ag-grid-angular>

app.component.ts:

    ...columnDefs = [
      {headerName: 'Make', field: 'make' },
      {headerName: 'Model', field: 'model' },
      {headerName: 'Price', field: 'price'}
  ];

  rowData = [
      { make: 'Toyota', model: 'Celica', price: 35000 },
      { make: 'Ford', model: 'Mondeo', price: 32000 },
      { make: 'Porsche', model: 'Boxter', price: 72000 }
  ];...

J'utilise Angular: 8.2.10, Angular CLI: 8.2.2, npm: 6.9.0

11
Sergey Smirnov

J'utilise la version communautaire sans aucun problème. Je viens de télécharger un essai d'entreprise et tout a changé. Lorsque j'ai rencontré ce problème, j'ai appris que [modules] = "modules" est requis sur la grille. Cela nécessite que ces deux lignes soient incluses dans le composant:

import { AllModules } from '@ag-grid-enterprise/all-modules';
modules: Module[] = AllModules;

Je n'ai jamais eu à le faire auparavant dans la version communautaire, mais cela a rapidement corrigé le problème. La réponse acceptée ci-dessus indique ce qui doit se produire lorsque votre application n'intègre que des modules individuels. Conformément à la documentation : "Si vous choisissez de sélectionner des modules individuels, au moins un modèle de ligne doit être spécifié. Après cela, tous les autres modules sont facultatifs en fonction de vos besoins".

0
Briana Finney

Pour résoudre ce problème, j'ai d'abord dû importer ModuleRegistry et AllCommunityModules dans maint.ts et ajouter ModuleRegistry.registerModules (AllCommunityModules) ; ci-dessous juste avant platformBrowserDynamic (). bootstrapModule (AppModule) comme:

import { ModuleRegistry, AllCommunityModules } from '@ag-grid-community/all-modules';


ModuleRegistry.registerModules(AllCommunityModules);
platformBrowserDynamic().bootstrapModule(AppModule)
 .catch(err => console.error(err));

Enfin, dans le composant (par exemple users.component.ts ) je l'ai utilisé en important les AllCommunityModules et en déclarant la variable comme:

import { AllCommunityModules } from '@ag-grid-community/all-modules';


public modules: Module[] = AllCommunityModules;

J'ai eu l'idée de cette réponse ici

0
omostan