Skip to content
Hallway
0:00 / 0:00

#angular#angularanimations#webanimations

Animations in Angular 4.0.0 - MATIAS NIEMELA

AI Dev Craft

64K subscribers • 2 videos on Hallway

YouTube
  • Recommended by 1 person: 1 on Stack Overflow and its sister sites.
  • Presented by Matias Niemelä, Angular Core Team Member
  • May be out of date. The tools, versions or practices it shows have likely moved on.

Intermediate. Assumes working knowledge.

15K views9 years ago1 recommendation

Web developmentVue, Svelte, Angular and others

Matias Niemelä presents the new animation features introduced in Angular 4, including routing transitions and reusable animations.

www.ng-conf.org ng-conf is a two day, single track conference focused on delivering the highest quality training in the Angular JavaScript framework. 500 to 700 Developers from across the country will converge on beautiful Salt Lake City, UT to participate in training sessions by the Google Angular team, and other Angular experts. In addition to the invaluable training, ng-conf will deliver a premier conference experience for attendees, providing opportunities to network with other developers, relax at social events, and engage in some of the unique entertainment opportunities available in Utah.

Why it's here

1 person recommends this

What people say. Recommended for learning how to implement complex route transitions and slide-in animations in Angular.

Moments people linked to

SpaceFozzyon Stack Overflow • Recommends

On “Angular 2 "slide in animation" of a routed component”

With Angular 4.1 it is now possible to create specific route animations. This is different from triggering an animation when a component is displayed because it will let you animate the entering/leaving component at the same time for a smooth transition, and let you modify the transition depending on which component is coming or going. That means you can do complex transitions like slide a component in from the right if you're drilling down into content, and slide it in from the left if you're entering it via a 'back' button from another component. First, annotate your router outlet like so (eg. app.component.html ): <div class="page" @routerAnimations="prepareRouteTransition(outlet)"…
16View the answer