I am trying to create a IgGrid in angular2. The steps which I have followed are as below:-1. Similar to src folder I have created a References\igniteui-angular2\ folder and placed these files unders it "igniteui.angular2.ts, igniteui.d.ts, igniteui.ts, jquery.d.ts"2. Created a angular2 component to load the IgGrid in it. Please refer the code attached3. When I try to execute the project I am getting the following error(s) the referenced angular2 component from IgniteUI.
Please validate If I have followed the correct steps to create a Grid component using IgGrid? How to resolve these errors which I am getting during run-time?
(anonymous) @ infragistics.core.js:240infragistics.core.js:299 Uncaught TypeError: $.widget is not a function at infragistics.core.js:299 at infragistics.core.js:299 at infragistics.core.js:1 at infragistics.core.js:1infragistics.lob.js:24 Uncaught TypeError: $.widget is not a function at infragistics.lob.js:24 at infragistics.lob.js:27 at infragistics.lob.js:1 Error: TypeError: Cannot read property 'igGrid' of undefined at eval (http://localhost:49928/app/References/igniteui-angular2/igniteui.angular2.js:177:22) at DecorateConstructor (http://localhost:49928/js/Angular2/reflect-metadata.js:536:29) at Object.decorate (http://localhost:49928/js/Angular2/reflect-metadata.js:98:20) at __decorate (http://localhost:49928/app/References/igniteui-angular2/igniteui.angular2.js:4:92) at Object.eval (http://localhost:49928/app/References/igniteui-angular2/igniteui.angular2.js:515:19) at eval (http://localhost:49928/app/References/igniteui-angular2/igniteui.angular2.js:1289:4) at eval (http://localhost:49928/app/References/igniteui-angular2/igniteui.angular2.js:1290:3) at eval (<anonymous>) Evaluating http://localhost:49928/app/References/igniteui-angular2/igniteui.angular2.js Evaluating http://localhost:49928/app/AppModule.js Evaluating http://localhost:49928/app/main.js Error loading http://localhost:49928/app/main.js
In Index.html I have these references <!-- Ignite UI Required Combined CSS Files --> <link href="http://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" /> <link href="http://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet" />
<!-- Ignite UI Required Combined JavaScript Files --> <script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script> <script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>
In systemjs.config.js, under packages i have 'igniteui-angular2': { main: 'index.js', defaultExtension: 'js' } In AppModule under declarations, IgGridComponent is added
Still I am getting the above mentioned errors, any ideas?
Hello ryork,
Please make sure that tsconfig file points to the right path where the source files are located. In case that the required igniteui angular2 files are located under 'References\igniteui-angular2\' folder, the tsconfig file should be configured like the following:
{... "files": [ "References/igniteui-angular2/jquery.d.ts", "References/igniteui-angular2/igniteui.d.ts", "References/igniteui-angular2/igniteui.angular2.ts",
.... ]}
Please let me know if this was the issue with your application.
Regards,Tsanna