fix(nav-schematics): update isHandset$ type and fix template expression (#11448)

Fixes #11445, fixes #11441

Author: chrisvfabio

src/lib/schematics/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html

@@ -3,8 +3,8 @@
     #drawer
     class="sidenav"
     fixedInViewport="true"
-    [attr.role]="isHandset$ | async ? 'dialog' : 'navigation'"
-    [mode]="isHandset$ | async ? 'over' : 'side'"
+    [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
+    [mode]="(isHandset$ | async) ? 'over' : 'side'"
     [opened]="!(isHandset$ | async)">
     <mat-toolbar color="primary">Menu</mat-toolbar>
     <mat-nav-list>

src/lib/schematics/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

@@ -11,8 +11,8 @@ import { map } from 'rxjs/operators';
         #drawer
         class="sidenav"
         fixedInViewport="true"
-        [attr.role]="isHandset$ | async ? 'dialog' : 'navigation'"
-        [mode]="isHandset$ | async ? 'over' : 'side'"
+        [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
+        [mode]="(isHandset$ | async) ? 'over' : 'side'"
         [opened]="!(isHandset$ | async)">
         <mat-toolbar color="primary">Menu</mat-toolbar>
         <mat-nav-list>
@@ -55,7 +55,7 @@ import { map } from 'rxjs/operators';
 })
 export class <%= classify(name) %>Component {
 
-  isHandset$: Observable<BreakpointState> = this.breakpointObserver.observe(Breakpoints.Handset)
+  isHandset$: Observable<boolean> = this.breakpointObserver.observe(Breakpoints.Handset)
     .pipe(
       map(result => result.matches)
     );