Probleme beim Einrichten der Beispieltabelle. "Es konnte kein passendes Zeilenmodell für rowModelType clientSide gefunden werden."

11

Ich habe das Tutorial "Erste Schritte" für das Ag-Grid des neuen Projekts durchgearbeitet. Alle Schritte abgeschlossen, aber eine Fehlermeldung angezeigt

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';

Ich habe meinen gesamten Code mit den im Tutorial bereitgestellten Beispielen und einigen Plunker-Beispielen verglichen und keine Unterschiede festgestellt. Es wurde versucht, ClientSideRowModelModule in app.module zu importieren, aber die Schnittstellen stimmten nicht mit dem angeforderten Winkel überein, sodass es nicht funktionierte. Ich habe keine Ideen mehr und konnte keine Informationen zur Behebung finden.

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 }
  ];...

Ich verwende Angular: 8.2.10, Angular CLI: 8.2.2, npm: 6.9.0

Sergey Smirnov
quelle

Antworten:

5

In Ihrer app.component.ts müssen Sie zuerst das ClientSideRowModelModule importieren

import { ClientSideRowModelModule } from '@ag-grid-community/client-side-row-model';

Anschließend müssen Sie in der AppComponent-Klasse eine Modularrayvariable wie folgt erstellen:

modules: Module[] = [ClientSideRowModelModule];

Schließlich müssen Sie in Ihrer app.component.html diese an die ag-grid-angle-Komponente binden

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

Weitere Informationen finden Sie in der Dokumentation zu AgGrid. Schritt 3 zur Installation von AgGrid-Modulen.

Brian Roadifer
quelle
1
Vielen Dank! Ich hätte ein bisschen mehr Zeit damit verbringen sollen, die Dokumentation zu lesen
Sergey Smirnov
Was passiert, wenn Sie die Enterprise-Version verwenden? Ich importiere alle ag-grid-Module und ich kann sehen, dass sie dieses enthalten, aber ich erhalte immer noch den gleichen Fehler: /
Stevie Star
@StevieStar Ich bin auch mit dem gleichen Problem konfrontiert, Problem wurde für Sie behoben?
Ruchi Gupta
0

Um dieses Problem zu lösen, musste ich zuerst ModuleRegistry und AllCommunityModules in wart.ts importieren und ModuleRegistry.registerModules (AllCommunityModules) hinzufügen . unten kurz vor platformBrowserDynamic (). bootstrapModule (AppModule) wie:

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


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

Zuletzt habe ich es in der Komponente (z. B. users.component.ts ) verwendet, indem ich die AllCommunityModules importiert und die Variable wie folgt deklariert habe:

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


public modules: Module[] = AllCommunityModules;

Ich habe die Idee von dieser Antwort hier

Omostan
quelle
0

Ich habe die Community-Version ohne Probleme verwendet. Ich habe gerade eine Testversion von Enterprise heruntergeladen und alles hat sich geändert. Als ich auf dieses Problem stieß, stellte ich fest, dass [modules] = "modules" im Grid erforderlich ist. Dazu müssen diese beiden Zeilen in der Komponente enthalten sein:

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

Ich musste dies noch nie in der Community-Version tun, aber das Problem wurde schnell behoben. Die oben akzeptierte Antwort lautet, was passieren muss, wenn Ihre Anwendung nur einzelne Module integriert. In der Dokumentation heißt es : "Wenn Sie einzelne Module auswählen, muss mindestens ein Zeilenmodell angegeben werden. Danach sind alle anderen Module je nach Ihren Anforderungen optional."

Briana Finney
quelle