diff --git a/aio/content/examples/router/src/app/crisis-list/crisis-list.component.css b/aio/content/examples/router/src/app/crisis-list/crisis-list.component.1.css
similarity index 100%
rename from aio/content/examples/router/src/app/crisis-list/crisis-list.component.css
rename to aio/content/examples/router/src/app/crisis-list/crisis-list.component.1.css
diff --git a/aio/content/examples/router/src/app/crisis-list/crisis-list.component.html b/aio/content/examples/router/src/app/crisis-list/crisis-list.component.1.html
similarity index 100%
rename from aio/content/examples/router/src/app/crisis-list/crisis-list.component.html
rename to aio/content/examples/router/src/app/crisis-list/crisis-list.component.1.html
diff --git a/aio/content/examples/router/src/app/crisis-list/crisis-list.component.ts b/aio/content/examples/router/src/app/crisis-list/crisis-list.component.1.ts
similarity index 63%
rename from aio/content/examples/router/src/app/crisis-list/crisis-list.component.ts
rename to aio/content/examples/router/src/app/crisis-list/crisis-list.component.1.ts
index 2fa2e05e49..e8945db638 100644
--- a/aio/content/examples/router/src/app/crisis-list/crisis-list.component.ts
+++ b/aio/content/examples/router/src/app/crisis-list/crisis-list.component.1.ts
@@ -4,7 +4,7 @@ import { Component } from '@angular/core';
 
 @Component({
   selector: 'app-crisis-list',
-  templateUrl: './crisis-list.component.html',
-  styleUrls: ['./crisis-list.component.css']
+  templateUrl: './crisis-list.component.1.html',
+  styleUrls: ['./crisis-list.component.1.css']
 })
 export class CrisisListComponent { }
diff --git a/aio/content/examples/router/src/app/hero-list/hero-list.component.css b/aio/content/examples/router/src/app/hero-list/hero-list.component.1.css
similarity index 100%
rename from aio/content/examples/router/src/app/hero-list/hero-list.component.css
rename to aio/content/examples/router/src/app/hero-list/hero-list.component.1.css
diff --git a/aio/content/examples/router/src/app/hero-list/hero-list.component.html b/aio/content/examples/router/src/app/hero-list/hero-list.component.1.html
similarity index 100%
rename from aio/content/examples/router/src/app/hero-list/hero-list.component.html
rename to aio/content/examples/router/src/app/hero-list/hero-list.component.1.html
diff --git a/aio/content/examples/router/src/app/hero-list/hero-list.component.ts b/aio/content/examples/router/src/app/hero-list/hero-list.component.1.ts
similarity index 60%
rename from aio/content/examples/router/src/app/hero-list/hero-list.component.ts
rename to aio/content/examples/router/src/app/hero-list/hero-list.component.1.ts
index 5ee06903c0..cbf2e54d99 100644
--- a/aio/content/examples/router/src/app/hero-list/hero-list.component.ts
+++ b/aio/content/examples/router/src/app/hero-list/hero-list.component.1.ts
@@ -4,7 +4,7 @@ import { Component } from '@angular/core';
 
 @Component({
   selector: 'app-hero-list',
-  templateUrl: './hero-list.component.html',
-  styleUrls: ['./hero-list.component.css']
+  templateUrl: './hero-list.component.1.html',
+  styleUrls: ['./hero-list.component.1.css']
 })
 export class HeroListComponent { }
diff --git a/aio/content/guide/router.md b/aio/content/guide/router.md
index b5456e089c..a18baf962a 100644
--- a/aio/content/guide/router.md
+++ b/aio/content/guide/router.md
@@ -896,11 +896,11 @@ Replace the contents of each component with the sample HTML below.
 
 <code-tabs>
 
-  <code-pane header="src/app/crisis-list/crisis-list.component.html" path="router/src/app/crisis-list/crisis-list.component.html">
+  <code-pane header="src/app/crisis-list/crisis-list.component.html" path="router/src/app/crisis-list/crisis-list.component.1.html">
 
   </code-pane>
 
-  <code-pane header="src/app/hero-list/hero-list.component.html" path="router/src/app/hero-list/hero-list.component.html" region="template">
+  <code-pane header="src/app/hero-list/hero-list.component.html" path="router/src/app/hero-list/hero-list.component.1.html" region="template">
 
   </code-pane>
 
@@ -972,7 +972,7 @@ Be sure it is the _last_ route in the configuration.
 
 To test this feature, add a button with a `RouterLink` to the `HeroListComponent` template and set the link to `"/sidekicks"`.
 
-<code-example path="router/src/app/hero-list/hero-list.component.html" linenums="false" header="src/app/hero-list/hero-list.component.html (excerpt)">
+<code-example path="router/src/app/hero-list/hero-list.component.1.html" linenums="false" header="src/app/hero-list/hero-list.component.html (excerpt)">
 
 </code-example>
 
@@ -1239,11 +1239,11 @@ Here are the files discussed in this milestone.
 
   </code-pane>
 
-  <code-pane header="hero-list/hero-list.component.html" path="router/src/app/hero-list/hero-list.component.html">
+  <code-pane header="hero-list/hero-list.component.html" path="router/src/app/hero-list/hero-list.component.1.html">
 
   </code-pane>
 
-  <code-pane header="crisis-list/crisis-list.component.html" path="router/src/app/crisis-list/crisis-list.component.html">
+  <code-pane header="crisis-list/crisis-list.component.html" path="router/src/app/crisis-list/crisis-list.component.1.html">
 
   </code-pane>