Hi,
I am loading list of Product Categories from database as checkbox in side menu.
loadProductCategories() {
this.CategoryList = …
}
Then I am loading these categories in my side menu:
<ion-scroll scrollY="true" style="width:100%;height:40%;overflow:hidden" #content>
<ion-list>
<ion-list-header color="secondary">
Range
</ion-list-header>
<ion-item-group *ngFor="let range of rangeList">
<ion-item *ngFor="let houseRange of range.HouseRangeList">
<ion-label>{{houseRange.Brand}}</ion-label>
<ion-checkbox color="dark" checked="false"
[(ngModel)]="checkedRange[houseRange._id]">
</ion-checkbox>
</ion-item>
</ion-item-group>
</ion-list>
</ion-scroll>
</ion-content>
<ion-footer class="bar-stable">
<button ion-button color="secondary" round style="left:0;right:0;margin:0; width: 100%;position: fixed;bottom:0;" menuClose="filter-menu"
(click)="applyFilters()">
Apply Filters
</button>
</ion-footer>
</ion-menu>
it creates a side menu like this :
which is perfect , if user clicks on “Apply Filters” button it works perfectly.
Problem:
The problem I am facing is if user select any option from House list and after that user closes the menu and dont click on “Apply Filter” button . The option in the menu remains selected even if user go back to the previous screen.
is there a way if user close the menu without clicking on Apply filters button to reset the menu and make all the checked checkboxes unchecked.
Thanks