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
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Dropdownlist - Item template empty after data source rebind

Thread ID:





142944 Feb 26,2019 02:03 PM UTC Jun 18,2020 07:57 AM UTC Angular - EJ 2 8
Tags: DropDownList
Philip Roelofs
Asked On February 26, 2019 02:04 PM UTC

I've encountered a problem with the DropDownList component in my Angular application.

The control has an array of objects as its data source, filtering is enabled and it uses a custom item template.

When I rebind the data source in my code (for example because an item was removed from the array and I want the DropDownList to be updated) 
the list contains the correct number of entries but they are empty.
It looks like there is an issue with the interpolation in the item template since the html code of the template is present.

Through testing I found that item data is displayed when I use filter the list but I when clear the filter the items are empty again.
The problem also does not occurre when the rebind of the data source happens before the drop down list is opened for first time or when filtering is not enabled.

It also seems to be irrelevant if an item was removed from the array or not. Simply rebinding the data source is enough.

I created some simple example code for you to reproduce the issue:

<ejs-dropdownlist id='dropdownlist' #dropdownlist [itemTemplate]="itemTemplate" [(dataSource)]="items"
(filtering)='onItemFiltering($event)' [allowFiltering]='true'>
<ng-template #itemTemplate let-item="">

export class AppComponent { @ViewChild("dropdownlist") dropdownlist: DropDownListComponent; items: string[] = []; constructor(private cdr: ChangeDetectorRef) { this.items.push("One"); this.items.push("Two"); this.items.push("Three"); } removeAndRebind(): void { //this.dropdownlist.value = null; //this.items.splice(0,1); this.dropdownlist.dataSource = null; this.dropdownlist.dataSource = this.items; } onItemFiltering: EmitType = (e: FilteringEventArgs) => { let query: Query = new Query(); if (e.text !== "") { let predicate = new Predicate("id", "startswith", e.text, true); query.where(predicate); } e.updateData(this.hardwareModels, query); } }

I've found threads describing similar problems with answers stating that these are bugs that should be fixed with newer version of the npm package but I was able to replicate the behavior with current version 16.4.54.

Prince Oliver [Syncfusion]
Replied On February 28, 2019 10:09 AM UTC

Hi Philip, 

Thank you for contacting Syncfusion support. 

We have validated the reported issue and we are considering this as a defect in our EJ2 DropDownList control. The fix for the reported issue will be included in our upcoming 2019 Volume 1 main release which is scheduled to be rolled on March 2019. Meanwhile you can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link: https://www.syncfusion.com/feedback/4979/    


Philip Roelofs
Replied On March 1, 2019 09:32 AM UTC

Hi Prince,

thank you for your feedback. 

I'm happy to hear that this bug will get fixed soon. I'm looking forward to next release.


Prince Oliver [Syncfusion]
Replied On March 4, 2019 05:14 AM UTC

Hi Philip, 

Most Welcome. We are glad to help you. 


Prince Oliver [Syncfusion]
Replied On April 17, 2019 05:55 AM UTC

Hello Philip,      

Thank you for being patient.   

We have fixed the reported “Item template not loaded” issue with the EJ2 DropDownList control. The fix is included in the version v17.1.41, Kindly refer to the following release notes section: https://ej2.syncfusion.com/documentation/release-notes/17.1.41/#dropdownlist  

We suggest you upgrade to the latest version to resolve the issue. Let us know if you need any further assistance on this.  


Deepak Jain
Replied On June 13, 2020 02:06 PM UTC

Hello Team,

Still getting the template error in Combobox

updating data source and also using additem method in scrolling


Attachment: itemtemplate_57e43c93.rar

Sureshkumar P [Syncfusion]
Replied On June 15, 2020 11:13 AM UTC

Hi Deepak, 
Thanks for your update. 
Based on your shared information, we have created the sample and could not replicate the issue from our end. please find the sample below with version 17.4.43. if still you have facing the issue, then please revert us with issue replicate sample with detailed issue replication procedure that will help us to provide exact solution as earlier as possible. 
Sureshkumar P 

Replied On June 17, 2020 01:26 PM UTC

I am facing the same problem with ejs-combobox. and the given example in stackblitz link is of dropdownlist. Can you please check if this issue is with combobox too ?


Sureshkumar P [Syncfusion]
Replied On June 18, 2020 07:57 AM UTC

Hi Puneet, 
Thanks for your update. 
We have modified the previous given stackblitz dropdownlist component sample into comobox. But we cannot replicate the issue from our end. please check the modified sample. 
If still you have facing the issue, then please revert us with above sample and detailed issue replication procedure that will help us to provide exact solution as earlier as possible. 
Sureshkumar P 


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.

Please sign in to access our forum

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

Live Chat Icon For mobile
Live Chat Icon