Revert "avoid multiple async calls (#13301)" (#13399)

This reverts commit 381c03725c.
This commit is contained in:
vivian-hu
2018-10-02 15:38:17 -07:00
committed by GitHub
parent 381c03725c
commit aea43ebcca
2 changed files with 13 additions and 25 deletions
@@ -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>
@@ -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) {}
}