diff --git a/aio/content/guide/hierarchical-dependency-injection.md b/aio/content/guide/hierarchical-dependency-injection.md
index 3d33a5a35e..19c2ba8899 100644
--- a/aio/content/guide/hierarchical-dependency-injection.md
+++ b/aio/content/guide/hierarchical-dependency-injection.md
@@ -1021,8 +1021,8 @@ The logical tree representation shows why this is:
          @Inject(AnimalService, @Optional)=>"🦔">
     <!-- ^^@SkipSelf() starts here,  @Host() stops here^^ -->
     <app-child>
-      <#VIEW @Provide(AnimalService="🦔")
-             @Inject(AnimalService, @SkipSelf, @Host, @Optional)=>"🐶">
+      <#VIEW @Provide(AnimalService="🐶")
+             @Inject(AnimalService, @SkipSelf, @Host, @Optional)=>"🦔">
                <!-- Add @SkipSelf ^^-->
       </#VIEW>
       </app-child>