Filter indeterminate behaviour

This commit is contained in:
Adina Țeudan 2020-11-25 15:12:22 +02:00
parent 517d351faa
commit c4ba84432a
3 changed files with 8 additions and 6 deletions

View File

@ -47,7 +47,7 @@ import { LogoComponent } from './logo/logo.component';
import { CompositeRouteGuard } from './utils/composite-route.guard'; import { CompositeRouteGuard } from './utils/composite-route.guard';
import { AppStateGuard } from './state/app-state.guard'; import { AppStateGuard } from './state/app-state.guard';
import { SimpleDoughnutChartComponent } from './components/simple-doughnut-chart/simple-doughnut-chart.component'; import { SimpleDoughnutChartComponent } from './components/simple-doughnut-chart/simple-doughnut-chart.component';
import { MatCheckboxModule } from '@angular/material/checkbox'; import { MAT_CHECKBOX_CLICK_ACTION, MatCheckboxModule } from '@angular/material/checkbox';
import { MatSlideToggleModule } from '@angular/material/slide-toggle'; import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { AnnotationIconComponent } from './components/annotation-icon/annotation-icon.component'; import { AnnotationIconComponent } from './components/annotation-icon/annotation-icon.component';
import { AuthGuard } from './auth/auth.guard'; import { AuthGuard } from './auth/auth.guard';
@ -253,7 +253,8 @@ export function HttpLoaderFactory(httpClient: HttpClient) {
multi: true, multi: true,
useFactory: languageInitializer, useFactory: languageInitializer,
deps: [LanguageService] deps: [LanguageService]
} },
{ provide: MAT_CHECKBOX_CLICK_ACTION, useValue: 'noop' }
], ],
bootstrap: [AppComponent] bootstrap: [AppComponent]
}) })

View File

@ -25,8 +25,7 @@
<mat-checkbox <mat-checkbox
[checked]="filter.checked" [checked]="filter.checked"
[indeterminate]="filter.indeterminate" [indeterminate]="filter.indeterminate"
(click)="$event.stopPropagation()" (click)="filterCheckboxClicked($event, filter); $event.stopPropagation()"
(change)="filterCheckboxClicked($event, filter)"
class="filter-menu-checkbox" class="filter-menu-checkbox"
color="primary" color="primary"
> >
@ -37,8 +36,7 @@
<div *ngFor="let subFilter of filter.filters" class="padding-left mat-menu-item" (click)="$event.stopPropagation()"> <div *ngFor="let subFilter of filter.filters" class="padding-left mat-menu-item" (click)="$event.stopPropagation()">
<mat-checkbox <mat-checkbox
[checked]="subFilter.checked" [checked]="subFilter.checked"
(click)="$event.stopPropagation()" (click)="filterCheckboxClicked($event, subFilter, filter); $event.stopPropagation()"
(change)="filterCheckboxClicked($event, subFilter, filter)"
color="primary" color="primary"
> >
<ng-template *ngTemplateOutlet="filterTemplate ? filterTemplate : defaultFilterTemplate; context: { filter: subFilter }"> <ng-template *ngTemplateOutlet="filterTemplate ? filterTemplate : defaultFilterTemplate; context: { filter: subFilter }">

View File

@ -29,6 +29,9 @@ export class FilterComponent {
if (parent) { if (parent) {
handleCheckedValue(parent); handleCheckedValue(parent);
} else { } else {
if (filter.indeterminate) {
filter.checked = false;
}
filter.indeterminate = false; filter.indeterminate = false;
filter.filters?.forEach((f) => (f.checked = filter.checked)); filter.filters?.forEach((f) => (f.checked = filter.checked));
} }