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

Template not working in Grid Column

Thread ID:

Created:

Updated:

Platform:

Replies:

127027 Oct 21,2016 01:40 PM UTC Oct 24,2016 10:21 AM UTC Angular 1
loading
Tags: ejGrid
Aniruddha Pondhe
Asked On October 21, 2016 01:40 PM UTC

Am using Angular2 integration.
I am trying to insert a template into the grid column. My template has a link. I want to open that link when I click on the cell value.

        <e-column field="OrderID" headerText="Order ID" width="75" textAlign="right" template="<a>asd</a>"></e-column>

When I try to give an <a> tag in the template there's an error parsing the template as follows:

zone.js:388 Unhandled Promise rejection: Template parse errors:
Parser Error: Unexpected token < at column 1 in [<a>asd</a>] in GridComponent@4:85 ("  <e-columns>
        <e-column field="OrderID" headerText="Order ID" width="75" textAlign="right" [ERROR ->][template]="<a>asd</a>"></e-column>
        <e-column field="CustomerID" headerText="Customer ID" wi"): GridComponent@4:85
Parser Error: Unexpected token < at column 1 in [<a>asd</a>] in GridComponent@4:85 ("
</ej-grid>

<a id="test" [ERROR ->]*ngFor="let router of list" [routerLink]="router.path" routerLinkActive="router-link-active">Edit</a>"): GridComponent@13:13
Parser Error: Unexpected token < at column 1 in [<a>asd</a>] in GridComponent@4:85 ("
</ej-grid>

<a id="test" *ngFor="let router of list" [ERROR ->][routerLink]="router.path" routerLinkActive="router-link-active">Edit</a>
"): GridComponent@13:41
Parser Error: Unexpected token < at column 1 in [<a>asd</a>] in GridComponent@4:85 ("
</ej-grid>

[ERROR ->]<a id="test" *ngFor="let router of list" [routerLink]="router.path" routerLinkActive="router-link-act"): GridComponent@13:0, Directive RouterLinkWithHref



Jayaprakash Kamaraj [Syncfusion]
Replied On October 24, 2016 10:21 AM UTC

Hi Aniruddha, 
 
To render the column template we suggest you to use property binding instead of passing the string value to the template attribute.   
 
Find the code example  
 
app.component.ts 
 
<ej-grid [allowPaging]="true" [allowSorting]="true" [dataSource]="gridData" [columns]="columns"> 
<e-columns> 
.. 
        <e-column headerText="Roles" width="80" [template]="template"></e-column> 
.. 
</ej-grid> 
 
`, 
    directives: [EJ_DIALOG_COMPONENTS, EJ_GRID_COMPONENTS, CORE_DIRECTIVES] 
}) 
export class AppComponent { 
.. 
       public template= "#columnTemp"; 
        
 
    constructor() {   
    } 
} 
 
Index.html 
 
<script type="text/x-jsrender" id="columnTemp"> 
      <a>asd</a> 
    </script> 

 
Regards, 
 
Jayaprakash K.

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

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

;