diff --git a/src/material/schematics/ng-generate/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template b/src/material/schematics/ng-generate/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template
index 09a94f9aeec8..b535d75affa2 100644
--- a/src/material/schematics/ng-generate/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template
+++ b/src/material/schematics/ng-generate/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template
@@ -1,7 +1,7 @@
 import { Component<% if(!!viewEncapsulation) { %>, ViewEncapsulation<% }%><% if(changeDetection !== 'Default') { %>, ChangeDetectionStrategy<% }%> } from '@angular/core';
 import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 import { Observable } from 'rxjs';
-import { map, share } from 'rxjs/operators';
+import { map, shareReplay } from 'rxjs/operators';
 
 @Component({
   selector: '<%= selector %>',<% if(inlineTemplate) { %>
@@ -21,7 +21,7 @@ export class <%= classify(name) %>Component {
   isHandset$: Observable<boolean> = this.breakpointObserver.observe(Breakpoints.Handset)
     .pipe(
       map(result => result.matches),
-      share()
+      shareReplay()
     );
 
   constructor(private breakpointObserver: BreakpointObserver) {}