docs(upgrade): Add missing providers for downgrading a service

aio/content/examples/upgrade-module/src/app/ajs-to-a-providers/hero-detail.component.ts

@@ -5,6 +5,7 @@ import { Hero } from '../hero';
 
 @Component({
   selector: 'hero-detail',
+  providers: [HeroesService],
   template: `
     <h2>{{hero.id}}: {{hero.name}}</h2>
   `

aio/content/guide/upgrade.md

@@ -778,13 +778,22 @@ delete them once the upgrade is over.
 It's also recommended to export the `heroesServiceFactory` function so that Ahead-of-Time
 compilation can pick it up.
 
+<div class="l-sub-section">
+
+Note that the 'heroes' string inside the factory refers to the AngularJS `HeroesService`.
+It is common in AngularJS apps to chose a service name for the token (e.g. heroes)
+and append the Service suffix to create the class name (e.g. heroesService)
+
+</div>
+
 <code-example path="upgrade-module/src/app/ajs-to-a-providers/ajs-upgraded-providers.ts" title="ajs-upgraded-providers.ts">
 </code-example>
 
 <code-example path="upgrade-module/src/app/ajs-to-a-providers/app.module.ts" region="register" title="app.module.ts">
 </code-example>
 
-You can then inject it in Angular using it's class as a type annotation:
+You can then inject it in Angular by adding the service to the component providers 
+and using it's class as a type annotation in the component constructor: 
 
 <code-example path="upgrade-module/src/app/ajs-to-a-providers/hero-detail.component.ts" title="hero-detail.component.ts">