Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 | 2x 2x 2x 2x 2x 2x 2x 2x 2x 12x 12x 12x 12x 12x 2x 2x 1x 1x 2x | import { ChangeDetectionStrategy, Component, inject, input, signal } from '@angular/core';
import { RouterModule, Router, NavigationEnd } from '@angular/router';
import { MatIconModule } from '@angular/material/icon';
import { MatButtonModule } from '@angular/material/button';
import { BreakpointObserver } from '@angular/cdk/layout';
import { filter } from 'rxjs';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { MatRippleModule } from '@angular/material/core';
@Component({
selector: 'cmx-layout',
imports: [
RouterModule,
MatIconModule,
MatButtonModule,
MatRippleModule,
],
templateUrl: './layout.component.html',
styleUrl: './layout.component.scss',
changeDetection: ChangeDetectionStrategy.OnPush
})
export class LayoutComponent {
public title = input('App');
public closed = signal(false);
private _observer = inject(BreakpointObserver);
private _router = inject(Router);
constructor() {
if (this._observer.isMatched('(width < 960px)')) {
this.closed.set(true);
this._router.events.pipe(
takeUntilDestroyed(),
filter(event => event instanceof NavigationEnd)
).subscribe(() => this.closed.set(true));
}
}
public toggleMenu() {
this.closed.update(value => !value);
}
}
|