Error: StaticInjectorError(AppModule)[GridColumnDirective -> GridComponent]

[Jesus Sanchez]

Hello,

I'm trying to run a grid component on my page, and I get the following error ...

ERROR Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[GridColumnDirective -> GridComponent]: 

  StaticInjectorError(Platform: core)[GridColumnDirective -> GridComponent]: 

    NullInjectorError: No provider for GridComponent!

Error: StaticInjectorError(AppModule)[GridColumnDirective -> GridComponent]: 

  StaticInjectorError(Platform: core)[GridColumnDirective -> GridComponent]: 

    NullInjectorError: No provider for GridComponent!

    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (core.js:8896)

    at resolveToken (core.js:9141)

    at tryResolveToken (core.js:9085)

    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:8982)

    at resolveToken (core.js:9141)

    at tryResolveToken (core.js:9085)

    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:8982)

    at resolveNgModuleDep (core.js:21218)

    at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (core.js:21907)

    at resolveDep (core.js:22278)

    at resolvePromise (zone.js:831)

    at resolvePromise (zone.js:788)

    at zone.js:892

    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)

    at Object.onInvokeTask (core.js:17290)

    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:422)

    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:195)

    at drainMicroTaskQueue (zone.js:601)

    at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:502)

    at invokeTask (zone.js:1744)

My component ...

import { Component, OnInit } from '@angular/core';

import { data } from './datasource';

import { PageSettingsModel } from '@syncfusion/ej2-angular-grids';

@Component({

selector: 'app-users-page',

templateUrl: './users-page.component.html',

styleUrls: ['./users-page.component.scss'],

})

export class UsersPageComponent implements OnInit {

public data: object[];

public pageSettings: PageSettingsModel

ngOnInit(): void {

this.data = data;

this.pageSettings = { pageSize: 6 };

}

}

My html ..

<ejs-grid [dataSource]='data' [allowPaging]="true" [pageSettings]='pageSettings'>

<e-columns>

<e-column field='OrderID' headerText='Order ID' textAlign='Right' width=90></e-column>

<e-column field='CustomerID' headerText='Customer ID' width=120></e-column>

<e-column field='Freight' headerText='Freight' textAlign='Right' format='C2' width=90></e-column>

<e-column field='OrderDate' headerText='Order Date' textAlign='Right' format='yMd' width=120></e-column>

</e-columns>

</ejs-grid>

[Thavasianand Sankaranarayanan]

Hi Jesus, 

Greeting from Syncfusion. 

We have validated with our end and we suspect that you are injecting both EJ1 and EJ2 modules in same application. It is not possible to use both EJ1 and EJ2 Grid in same application as they results in selector conflicts. We suggest you to remove the EJ1 Modules from the app.module.ts to resolve the reported problem. 

Code Example: 

[app.module.ts] 

@NgModule({ 

  ... 

    imports: [ 

   BrowserModule, 

      // EJAngular2Module.forRoot(),  remove EJ1 modules    

    RichTextEditorModule , 

    GridModule, 

    ButtonModule 

    ], 

    ... 

  }) 

   

Note : We suggest you to use @syncfusion/ej2-angular-grids(component name) for latest npm packages. 

Help documentation : https://ej2.syncfusion.com/angular/documentation/grid/getting-started/?no-cache=1 

KB: https://www.syncfusion.com/kb/9685/how-to-get-started-easily-with-syncfusion-angular-7-data-grid 

Regards, 

Thavasianand S. 

[Jesus Sanchez]

Thanks!!!

Work it!!!

[Thavasianand Sankaranarayanan]

Hi Jesus, 

 

We are happy that the problem has been solved. 

 

Please get back to us if you need any further assistance.  

                          

Regards, 

Thavasianand S.