Thread ID: |
Created: |
Updated: |
Platform: |
Replies: |
142305 | Jan 26,2019 04:37 PM UTC | Oct 7,2020 11:55 AM UTC | Angular - EJ 2 | 7 |
![]() |
Tags: Grid |
...
this.childGrid = {
dataSource: orderDatas,
queryString: 'EmployeeID',
allowPaging: true,
pageSettings: {pageSize: 6, pageCount: 5},
columns: [
{ field: 'OrderID', headerText: 'Order ID', textAlign: 'Right', width: 120 },
{ headerText: 'Ship Country', template: '<div>${ShipCountry}</div>', width: 120 },
{ field: 'Freight', headerText: 'Freight', width: 120 },
{ field: 'ShipName', headerText: 'Ship Name', width: 150 }
]
};
... |
@Component({
selector: 'app-root',
template: `<ejs-grid #grid [dataSource]='pData' height='315px' [childGrid]='childGrid'>
<e-columns>
. . . .
<e-column field='City' headerText='City' width=150></e-column>
</e-columns>
</ejs-grid>
<ng-template #childtemplate let-data>
<div class="image">
<img src="{{data.EmployeeID}}.png" alt="{{data.EmployeeID}}"/>
</div>
</ng-template>
`,
providers: [DetailRowService]
})
export class AppComponent implements OnInit, AfterViewInit {
constructor(@Inject(ViewContainerRef) private viewContainerRef?: ViewContainerRef) {
}
public pData: object[];
@ViewChild('childtemplate') public childtemplate: any;
@ViewChild('grid') public grid: GridComponent;
public childGrid: any;
ngAfterViewInit() {
this.childtemplate.elementRef.nativeElement._viewContainerRef = this.viewContainerRef;
this.childtemplate.elementRef.nativeElement.propName = 'template';
}
ngOnInit(): void {
this.pData = employeeData;
this.childGrid = {
dataSource: data,
queryString: 'EmployeeID',
load() {
this.registeredTemplate = {}; // set registertemplate value as empty in load event
},
columns: [
{ headerText: 'Employee Image’, template: this.childtemplate},
{ field: 'ShipName', headerText: 'Ship Name', width: 150 }
],
};
}
}
|
export class AppComponent implements OnInit, AfterViewInit {
@ViewChild('childTemplate', { static: true })
public template: TemplateRef<{}>;
public childGrid: any;
constructor(@Inject(ViewContainerRef) private viewContainerRef?: ViewContainerRef) {
}
ngAfterViewInit() {
this.template.elementRef.nativeElement._viewContainerRef = this.viewContainerRef;
this.template.elementRef.nativeElement.propName = 'template';
}
ngOnInit(): void {
this.childGrid = {
.
.
columns: [
{ headerText: 'Customer ID', template: this.template, width: 150 },
.
.
],
};
}
} |
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.
This page will automatically be redirected to the sign-in page in 10 seconds.