docs

Angular Integration

Below, we show you how to use ZingGrid in your AngularJS project.

Usage

Include the following dependencies in the header of your HTML file:

CloseCopy Copied
<script src="path/to/zinggrid.min.js" defer></script>

Import Angular component:

CloseCopy Copied
import { Component } = '@angular/core';

Create a ZingGrid component:

CloseCopy Copied
@Component({
  selector: 'my-component',
  template: '<zing-grid caption="Hello World"></zing-grid>',
})
class MyComponent {
  datastore = [
    { "breed": "Chow Chow", "name": "Butter"},
    { "breed": "Dachshund", "name": "Sousage"},
    { "breed": "Pug", "name": "Potat"},
    { "breed": "Corgi", "name": "Plop"},
    { "breed": "Pomeranian", "name": "Floof"}
  ];
}

Display your new component:

CloseCopy Copied
<my-component></my-component>

Example

Edit
Download
CloseCopy Copied
CloseCopy Copied
CloseCopy Copied

On This Page

loadingloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloadingloading