docs: fix animations example/remove 1st person (#35046)

Fixes #34940 and removes first person from transitions-triggers.md

PR Close #35046

aio/content/examples/animations/src/app/app.component.html

@@ -12,10 +12,12 @@ Toggle All Animations <input type="checkbox" [checked]="!animationsDisabled" (cl
   <a id="auto" routerLink="/auto" routerLinkActive="active">Auto Calculation</a>
   <a id="heroes" routerLink="/heroes" routerLinkActive="active">Filter/Stagger</a>
   <a id="hero-groups" routerLink="/hero-groups" routerLinkActive="active">Hero Groups</a>
+  <a id="insert-remove" routerLink="/insert-remove" routerLinkActive="active">Insert/Remove</a>
+
 </nav>
 
 <!-- #docregion route-animations-outlet -->
 <div [@routeAnimations]="prepareRoute(outlet)" >
   <router-outlet #outlet="outlet"></router-outlet>
 </div>
-<!-- #enddocregion route-animations-outlet -->
+<!-- #enddocregion route-animations-outlet -->

aio/content/examples/animations/src/app/app.module.ts

@@ -35,6 +35,7 @@ import { InsertRemoveComponent } from './insert-remove.component';
       { path: 'hero-groups', component: HeroListGroupPageComponent },
       { path: 'enter-leave', component: HeroListEnterLeavePageComponent },
       { path: 'auto', component: HeroListAutoCalcPageComponent },
+      { path: 'insert-remove', component: InsertRemoveComponent},
       { path: 'home', component: HomeComponent, data: {animation: 'HomePage'} },
       { path: 'about', component: AboutComponent, data: {animation: 'AboutPage'} },
 

aio/content/examples/animations/src/app/insert-remove.component.html

@@ -1,4 +1,7 @@
 <!-- #docplaster -->
+
+<h2>Insert/Remove</h2>
+
 <nav>
   <button (click)="toggle()">Toggle Insert/Remove</button>
 </nav>

aio/content/examples/animations/src/app/insert-remove.component.ts

@@ -9,10 +9,10 @@ import { trigger, transition, animate, style } from '@angular/animations';
     trigger('myInsertRemoveTrigger', [
       transition(':enter', [
         style({ opacity: 0 }),
-        animate('5s', style({ opacity: 1 })),
+        animate('100ms', style({ opacity: 1 })),
       ]),
       transition(':leave', [
-        animate('5s', style({ opacity: 0 }))
+        animate('100ms', style({ opacity: 0 }))
       ])
     ]),
 // #enddocregion enter-leave-trigger