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. Image for the cookie policy date

Accessing EJComponents after upgrading to latest version

Hey,

After upgrading to latest Syncfusion version I'm not able anymore access ej components as usual via ViewChild. I used to do that this way:

import { EJComponents } from './../../../../../../node_modules/ej-angular2/src/ej/core';
@ViewChild('gpLayoutMenu') private gpLayoutMenu: EJComponents<ej.Menu, any>;


How can I do that after upgrading to latest Syncfusion version?




1 Reply

AS Abinaya Subbiah Syncfusion Team June 19, 2017 04:00 AM

Hi Mantelisb, 

Thanks for contacting Syncfusion support. 

We are not able to reproduce the issue at our end. We can access the EJComponents from ej-angular2 package of latest Syncfusion Angular package. Refer to the below code snippet. 

[grid.component.html] 
<ej-grid #mygrid [allowPaging]="true" [allowSorting]="true" [dataSource]="gridData"> 
    <e-columns> 
        <e-column field="OrderID" headerText="Order ID" width="75" textAlign="right"></e-column> 
        <e-column field="CustomerID" headerText="Customer ID" width="80"></e-column> 
        <e-column field="EmployeeID" headerText="Employee ID" width="75" textAlign="right"> </e-column> 
        <e-column field="Freight" width="75" format="{0:C}" textAlign="right"></e-column> 
        <e-column field="OrderDate" headerText="Order Date" width="80" format="{0:MM/dd/yyyy}" textAlign="right"></e-column> 
    </e-columns> 
</ej-grid> 

[grid.component.ts] 
import { Component, ViewChild } from '@angular/core'; 
import { EJComponents } from 'ej-angular2'; 
 
@Component({ 
    selector: 'ej-app', 
    templateUrl: './grid.component.html', 
}) 
export class GridComponent { 
    @ViewChild('mygrid') gridIns: EJComponents<any, any>; 
    public gridData: any; 
    constructor() { 
        this.gridData = [{ 
            OrderID: 10248, CustomerID: 'VINET', EmployeeID: 5, 
            OrderDate: new Date(8364186e5), Freight: 32.38 
        }, 
        { 
            OrderID: 10249, CustomerID: 'TOMSP', EmployeeID: 6, 
            OrderDate: new Date(836505e6), Freight: 11.61 
        }, 
        { 
            OrderID: 10250, CustomerID: 'HANAR', EmployeeID: 4, 
            OrderDate: new Date(8367642e5), Freight: 65.83 
        }, 
        { 
            OrderID: 10251, CustomerID: 'VICTE', EmployeeID: 3, 
            OrderDate: new Date(8367642e5), Freight: 41.34 
        }, 
        { 
            OrderID: 10252, CustomerID: 'SUPRD', EmployeeID: 4, 
            OrderDate: new Date(8368506e5), Freight: 51.3 
        }]; 
    } 
    ngAfterViewInit() { 
        console.log(this.gridIns.model.allowSorting); // Getting component model property 
    } 
} 
 
For your convenience we have prepared sample to accessing EJComponents from ej-angular2 package. Find the attached sample in below link. 


Please let us know if you need further assist on this. 

Regards, 
Abinaya S 


Loader.
Live Chat Icon For mobile
Up arrow icon