Sample does not work out of the box (from syncfusion github)

[Michal Szkudlarek]

Hi,

wanted to play around with tree grid to see if this is suitable for my need, but provided sample repo does not work properly.
Tried running with the newest verstion of "^19.1.58", but still fails.

Steps:
Clone repo
npm install
npm start
open localhost:4200

and you will get:

main.ts:12 Error: inject() must be called from an injection context

    at injectInjectorOnly (core.js:4708)

    at ɵɵinject (core.js:4718)

    at Module.ɵɵdirectiveInject (core.js:14619)

    at NodeInjectorFactory.TreeGridComponent_Factory [as factory] (ej2-angular-treegrid.js:486)

    at getNodeInjectable (core.js:3596)

    at instantiateAllDirectives (core.js:10280)

    at createDirectivesInstances (core.js:9629)

    at Module.ɵɵelementStart (core.js:14837)

    at AppComponent_Template (app.component.html:1)

    at executeTemplate (core.js:9600)

Same for me. Building on following Angular version:
Angular CLI: 11.2.6
Node: 15.5.0
OS: win32 x64

Package Version

@angular-devkit/architect 0.1102.6 (cli-only)
@angular-devkit/core 11.2.6 (cli-only)
@angular-devkit/schematics 11.2.6 (cli-only)
@schematics/angular 11.2.6 (cli-only)
@schematics/update 0.1102.6 (cli-only)

Also created an issue on your gthub:

https://github.com/SyncfusionExamples/ej2-angular-11-tree-grid/issues/2

[Pon Selva Jeganathan]

Hi Michal,   

  

Thanks for contacting syncfusion forum. 

 

We are able to reproduce the issue at our end. And we need to validate by using dependent components and will update you with further details on April 30, 2021.   

 

Until then we value your patience.   

  

Regards,    

Pon selva    

[Pon Selva Jeganathan]

Hi Michal,   

  

Thanks for your patience. 

 

We suspect that the issue may be due to the Node version. We suggest you to use the stable LTS version of node inorder to resolve the issue. 

 

Kindly get back to us for further assistance. 

  

Regards,    

Pon selva    

[Michal Szkudlarek]

Unfortunately this is not correct answer.it is not related with node version.

This answer is correct

https://stackoverflow.com/questions/67189702/syncfusion-treegrid-angular-11-error-inject-must-be-called-from-an-injecti

[Pon Selva Jeganathan]

Hi Michal,   

  

Thanks for update. 

 

We checked the github sample but we are unable to reproduce the issue at our end. Please refer to the below sample, 

https://www.syncfusion.com/downloads/support/forum/164951/ze/ej2-angular-11-tree-grid-main-141864208 

 

If you still face the issue after referring the above sample, we suggest you add the below shared path in the compilerOptions section of tsconfig.app.json of the angular application to resolve this issue:  

 

{  

  "extends": "./tsconfig.json",  

  "compilerOptions": {  

    "outDir": "./out-tsc/app",  

    "types": [],  

    "paths": { "@angular/*": [ ../node_modules/@angular/* ] }  

  },  

  "files": [  

    "src/main.ts",  

    "src/polyfills.ts"  

  ],  

  "include": [  

    "src/**/*.d.ts"  

  ]  

}  

 

Kindly get back to us for further assistance.  

  

Regards,    

Pon selva    

 

[Michael Mairegger]

The workaround mentioned above ist not needed if the installed Angular version is <= 12.2.8.

I use use ~12.2.8 as version definition for Angular. So it might that after npm update I get a newer version. Currently the verison is 12.2.13 (wanted version). Then this workaround above is needed. I want to prevent the use of this workaround.

Why are Syncfusion packages locked to a maximum version e.g. 12.2.8 and not to ~12.2.8?

[Pon Selva Jeganathan]

Hi Michal,    

   

Thanks for the update.  

 

We checked your query by preparing sample (~12.2.8 version), but we were unable to reproduce the issue at our end. Also, we suggest you check the angular 12 with syncfusion 19.3.43 version and stable LTS version of node. 

 

Please refer to the below sample, 

https://www.syncfusion.com/downloads/support/forum/164951/ze/Grid_Sample-1676191635 

 

After following the above reference, still faced issue please share us the following details.

1. Share the package.json details.
2. If possible, reproduce the issue in the attached sample or share the issue reproducible sample.
3. Share the product detail version.

 

The provided information will be helpful to provide you response as early as possible.   

 

Regards, 

Pon selva 

[Michael Mairegger]

Hi Pon Selva,

to be honest, I currently cannot reproduce the issue anymore in none of my projects. It works. Previously I hat installed latest version of node. Maybe version 16 had this kind of issues since angular 12 works with 14

Regards,
Michael

[Jagadesh Ram Raajkumar]

Hi Michael, 

Thanks for the update.

We are glad that your query has been resolved. So, as in previous update we suggest you to use the latest version possible. Kindly get back to us for further assistance. 

Regards,
Jagadesh Ram