Get a brief summary of the necessary animation-specific functions that are imported at the top of a given component.
- [Narrator] Animation plays a vital role…in improving the user experience of your app.…Fortunately, Angular provides us with the ability…to easily define animations based on your app's logic.…These animations are based on the Web Animations API…which allow animations to run natively on browsers.…So to get started with animation in Angular,…we have to import some animation specific functions…and also import the Angular animations library.…New in Angular Four, the animations are no longer…a part of the Angular core library.…
So we have to first use npm to…install the Angular animations library.…So on the console in our project, lets type in npm.…Alright, great.…So next we have to import a browser animations module…in our app.module.ts file.…So we'll click on this file.…And now we will import it here at the top.…
And we'll import it from...…Alright, then we have to add it…to the imports array within N G module.…So a comma and we add browserAnimationsModule.…Next, lets head on over to the component…which we wish to apply animations.…
- How components work
- Defining HTML templates
- Defining CSS
- Class binding and style binding
- Property binding and event binding
- Creating routes for navigation
Skill Level Intermediate
1. Getting Up and Running with Angular
2. Templating Basics
3. Data Binding
5. Tying It All Together
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.