Add toggle group deselection

This commit is contained in:
Patrick Gebhardt 2020-06-19 14:19:27 +02:00
parent cc07e11f8f
commit cf611ce8c4
2 changed files with 24 additions and 3 deletions

View File

@ -15,9 +15,15 @@
<h2>What would you prefer?</h2>
<div *ngFor="let key of multiPresetsKeys" class="sub-group">
<span class="label">{{key|translate}}:</span><br>
<mat-button-toggle-group [(ngModel)]="multiPresetSelection[key]" [value]="undefined">
<mat-button-toggle *ngFor="let preset of multiPresets.get(key)"
[value]="preset.preset_id">{{preset.tag_label|translate}}</mat-button-toggle>
<mat-button-toggle-group [ngModel]="multiPresetSelection[key]" [value]="undefined">
<mat-button-toggle
#btn
(click)="btn.checked = onMultiPresetSelect(preset)"
*ngFor="let preset of multiPresets.get(key)"
[value]="preset.preset_id"
>
{{preset.tag_label|translate}}
</mat-button-toggle>
</mat-button-toggle-group>
</div>
</section>

View File

@ -79,4 +79,19 @@ export class SearchInputComponent implements OnInit {
await this.router.navigate(['/search'], {queryParams: {q: objToBase64(query)}});
}
/**
* Handles a (multi) preset click.
* @param preset The clicked preset
* @return If the button is selected
*/
onMultiPresetSelect(preset: Preset) {
if (this.multiPresetSelection[preset.parameter] === preset.preset_id) {
this.multiPresetSelection[preset.parameter] = undefined;
return false;
} else {
this.multiPresetSelection[preset.parameter] = preset.preset_id;
return true;
}
}
}