We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to create Grid instance using @ViewChild in Angular 2

Platform: JavaScript |
Control: ejGrid |
Published Date: March 1, 2017 |
Last Revised Date: March 1, 2017
Tags: grid

We can access the Grid instance in Angular2 component by using @ViewChild decorator and pass the template reference name as parameter to the @ViewChild decorator.

Template

 

TypeScript

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

import {CommonModule} from "@angular/common";

import {EJComponents} from './ej/core';

 

@Component({

   selector: 'ej-app',

  templateUrl: 'app/app.component.html',

})

 

export class AppComponent {

 

public gridData = ej.DataManager({

    url: "http://mvc.syncfusion.com/Services/Northwnd.svc/Employees"

});

 

@ViewChild('grid') Grid: EJComponents<any, any>;

ngAfterViewInit(){

 

    this.Grid.widget.selectRows(2)// call the selectrows API for selecting the rows

}

 

}

 

The following screenshot display the selected rows based on the value.

Figure 1: Output

ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon