Below is my side nav to select different products and dropdown. I tried using [ngModel]="brand?.selected but it does not work or I am using it incorrectly. How do I approach this? Do I need to implement OnChanges and/or DoCheck? If I select google from the sidenav, how do you set the check input of the dropdown automatically?
<div [ngClass]="displayBrand">
<ul *ngFor="let brand of brands | orderby: ['fieldName']; let i =
index">
<div class="checkbox">
<input type="checkbox" [value]="brand.selected"
(change)="onBrand($event, i)">{{ brand.fieldName}}
({{brand.getCount()}})
<a (click)="onBrandSite(brand.fieldName)">site</a>
</div>
</ul>
</div
<div class="btn-group" role="group" *ngIf="isBrand">
<button type="button" class="btn btn-default dropdown-toggle" data-
toggle="dropdown"
aria-haspopup="true" aria-expanded="false">Brands<span
class="caret"></span>
</button>
<ul class="dropdown-menu">
<ul *ngFor="let brand of brands | orderby: ['fieldName']; let i
= index">
<li class="checkbox"><input type="checkbox"
[value]="brand.selected"
(change)="onBrand($event, i)">{{ brand.fieldName}}
<a (click)="onBrandSite(brand.fieldName)">site</a>
</li>
</ul>
</ul>
</div>
This is my code to select the brand. Brand is declared as brands: SearchField[] = [];
export class SearchField {
fieldName: string;
products: Product[];
selected: boolean;
}
onBrand(event, index: number) {
var isChecked = event.currentTarget.checked;
this.brands[index].selected = isChecked;
this.getClickedFilters();
this.getClickedSelected();
}