SAP OpenUI5 - SearchField break List template if a search string doesn't provides data

Question

I'm developing a web application using SAP OpenUI5 framework.

I have an issue filtering data in a List table, with SearchField widget. The SearchField is defined in xml view:

<SearchField id="taskSearchBox" enableClear="true" liveChange="onSearchTasks"></SearchField>

on my controller I've defined function called at every change in the SearchField:

        onSearchTasks : function (oEvent) {

            var self = this;

            let searchField = 'Title';
            let searchString = oEvent.getSource().getValue() ;              

            let oFilter = new Filter(searchField, sap.ui.model.FilterOperator.Contains, searchString);

            self.getView().byId('tableTask').getBinding('items').filter([oFilter]);

        },

Here's a GIF of my issue:

Answer 1

The issue was related to the creation of the binding, between model and Table items.

Code with issue:

                let oTable = self.getView().byId('tableTask');
                oTable.bindAggregation('items', {
                    path:'/rowsData',   // field name of JSON object containing rowsData
                    template: oColumnsListItem,  // rowTemplate of cells
                });

Code without issue:

                let oTable = self.getView().byId('tableTask');
                oTable.removeAllItems();                                        
                oTable.removeAllAggregation();
                oTable.bindAggregation('items', {
                    path:'/rowsData',   // field name of JSON object containing rowsData
                    template: oColumnsListItem,  // rowTemplate of cells
                });

so adding these two lines of code:

                oTable.removeAllItems();                                        
                oTable.removeAllAggregation();

solved the issue.

Honestly do not know if it's the correct way or just a workaround, but now everything is working.