I'm trying to update the list of options in dropdown after click the "-More-" option. I get it work with template for options and binding click event I prevent it stopPropagation() func.
<ng-template let-city pTemplate="item">
<span (click)="onClickFunction(city, $event)">{{city.label}}</span>
</ng-template>
onClickFunction(city, e) {
if (city.label === '-More-') {
this.cities.pop();
this.cities = [...this.cities, ...this.newCities];
e.stopPropagation();
this.cd.markForCheck();
this.cd.detectChanges();
}
}
But the problem is that sometimes it works from the first load, but usally I click 3 times on "-More-" option and then it works correctly. I this a bug or I'm doing it wrong? maybe there is another better solution? Thanks