mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
This reverts commit 381c03725c.
This commit is contained in:
+4
-4
@@ -3,9 +3,9 @@
|
||||
#drawer
|
||||
class="sidenav"
|
||||
fixedInViewport="true"
|
||||
[attr.role]="isHandset ? 'dialog' : 'navigation'"
|
||||
[mode]="isHandset ? 'over' : 'side'"
|
||||
[opened]="!isHandset">
|
||||
[attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
|
||||
[mode]="(isHandset$ | async) ? 'over' : 'side'"
|
||||
[opened]="!(isHandset$ | async)">
|
||||
<mat-toolbar>Menu</mat-toolbar>
|
||||
<mat-nav-list>
|
||||
<a mat-list-item href="#">Link 1</a>
|
||||
@@ -20,7 +20,7 @@
|
||||
aria-label="Toggle sidenav"
|
||||
mat-icon-button
|
||||
(click)="drawer.toggle()"
|
||||
*ngIf="isHandset">
|
||||
*ngIf="isHandset$ | async">
|
||||
<mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
|
||||
</button>
|
||||
<span><%= project %></span>
|
||||
|
||||
+9
-21
@@ -1,7 +1,7 @@
|
||||
import { Component, OnDestroy<% if(!!viewEncapsulation) { %>, ViewEncapsulation<% }%><% if(changeDetection !== 'Default') { %>, ChangeDetectionStrategy<% }%> } from '@angular/core';
|
||||
import { Component<% if(!!viewEncapsulation) { %>, ViewEncapsulation<% }%><% if(changeDetection !== 'Default') { %>, ChangeDetectionStrategy<% }%> } from '@angular/core';
|
||||
import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { Observable } from 'rxjs';
|
||||
import { map } from 'rxjs/operators';
|
||||
|
||||
@Component({
|
||||
selector: '<%= selector %>',<% if(inlineTemplate) { %>
|
||||
@@ -16,25 +16,13 @@ import { takeUntil } from 'rxjs/operators';
|
||||
encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>,
|
||||
changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %>
|
||||
})
|
||||
export class <%= classify(name) %>Component implements OnDestroy {
|
||||
export class <%= classify(name) %>Component {
|
||||
|
||||
isHandset: boolean;
|
||||
isHandset$: Observable<boolean> = this.breakpointObserver.observe(Breakpoints.Handset)
|
||||
.pipe(
|
||||
map(result => result.matches)
|
||||
);
|
||||
|
||||
/** Emits when the component is destroyed. */
|
||||
private readonly _destroyed = new Subject<void>();
|
||||
|
||||
constructor(breakpointObserver: BreakpointObserver) {
|
||||
breakpointObserver.observe(Breakpoints.Handset)
|
||||
.pipe(
|
||||
takeUntil(this._destroyed)
|
||||
).subscribe(result => {
|
||||
this.isHandset = result.matches;
|
||||
});
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this._destroyed.next();
|
||||
this._destroyed.complete();
|
||||
}
|
||||
constructor(private breakpointObserver: BreakpointObserver) {}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user