Angular/ Ui-Grid (ng-grid) / angular is not defined

Question

I am trying to get Angular´s ui-grid running and use the following code:

import {NgModule} from "@angular/core";
import {BrowserModule} from "@angular/platform-browser";
import {RouterModule} from "@angular/router";

import {BosOverviewComponent} from "./bosoverview.component";

import {UiGridModule} from 'angular-ui-grid';

@NgModule({
  declarations: [
    BosOverviewComponent
  ],
  imports: [
    BrowserModule,
    RouterModule,
    UiGridModule
  ],
  exports: [
    BosOverviewComponent
  ],
})

export class BusinessObjectsModule {
}

Using npm start, I always get the following error:

Uncaught ReferenceError: angular is not defined
    at ui-grid.js:8
    at Object.../../../../angular-ui-grid/ui-grid.js (ui-grid.js:10)
    at __webpack_require__ (inline.bundle.js:55)
    at Object.../../../../angular-ui-grid/index.js (index.js:1)
    at __webpack_require__ (inline.bundle.js:55)
    at Object.../../../../../src/app/views/businessobjects/businessobjects.module.ts (bosoverview.component.ts:7)
    at __webpack_require__ (inline.bundle.js:55)
    at Object.../../../../../src/app/app.module.ts (app.helpers.ts:66)
    at __webpack_require__ (inline.bundle.js:55)
    at Object.../../../../../src/main.ts (environment.ts:8)

What should I do? Thanks!

ktretyak · Accepted Answer · 2018-01-04 16:03:45Z

2

As you can see:

UI-Grid is currently compatible with Angular versions ranging from 1.4.x to 1.6.x.

You are trying to use it at Angular 2+...

answered Jan 4, 2018 at 16:03

ktretyak

32.2k11 gold badges48 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

GMK · Accepted Answer · 2018-01-05 23:59:37Z

ktretyak is right. UI-Grid is only officially supported by AngularJS, not Angular 2+. Fortunately you have options. First, you may be able to make it work anyways. This github repo, for instance, claims to be an example of UI-Grid working in Angular 2+. And the dev team does have a plan to upgrade UI-Grid to Angular 5+, if you are willing to wait.

It may be a better idea, though, to find a library that is officially supported on Angular 2+ now. Reading through this discussion on the UI-Grid site points you at several data grids that are compatible with Angular 2+.

If you are already using Angular Material they have a mat-table
ngx-datatable is an Angular component for presenting large and complex data. It has all the features you would expect from any other table but in a light package with no external dependencies. (from the github page)
PrimeNG makes a set of UI components for Angular 2+. They're open source, on github, and they have a pretty slick datatable.
ag-grid makes "The Best HTML 5 Grid In The World" according to their website. They have a version works with Angular 2+. They have a freemium model, but their free version looks nice.
angular2-datatable is yet another open-source option that, of course, officially supports Angular 2+.

So, don't stress yourself out trying to shoehorn in a library that isn't really built to do what you want it to. It's much easier to use one that is designed to work with Angular 2+.

Collectives™ on Stack Overflow

Angular/ Ui-Grid (ng-grid) / angular is not defined

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related