In this video, Aviv Ben-Yosef teaches how the directive linking function can be replaced with the $postLink lifecycle hook. Learn why controllers can and should perform DOM operations when necessary.
- [Instructor] With directives, it is possible…to supply a link function which is called after…Angular's compiler linking is completed.…The linking function is useful for components…that need to perform actions on the DOM.…For example, integrating with a third-party library…such as D3; whenever upgrading a directive…that has a link function, some thinking is required.…The linking function has a clear intent…and that's to run code that depends on the compiling…and linking of the component; if that's not the case,…it should not be used; if the link function does not…access the element or the DOM, then its logic…can be moved to reside inside the component's controller,…for example, inside (mumbles); some directives, though…use link for good reason; just for that,…Angular provides the postLink lifecycle hook on components.…
This hook allows components to truly take…full responsibility of the DOM.…Using this hook is straightforward.…Simply move whatever previous work from the directives…link function to a new controller element called postLink.…
Aviv Ben-Yosef kicks off the course by explaining what's different in Angular 1.6, as well the different motives for upgrading. Next, he walks through how to safely upgrade an existing app. He covers going from controllers to directives, as well as component lifecycle hooks. He also goes into the architectural changes in Angular, such as one-way data flow and immutability. To wrap up, he discusses how to properly test components.
- Deciding to upgrade an existing app
- Upgrading to Angular 1.6
- Removing standalone controllers
- Using directives as route targets
- Converting a controller's code
- Converting a controller's template
- Comparing directives and components
- Converting a directive
- Reviewing the concept of one-way binding
Skill Level Intermediate
AngularJS 1: Building a Data-Driven Appwith Ray Villalobos2h 15m Intermediate
1. Controllers to Directives
2. Use controllerAs
Convert a controller’s code1m 57s
3. Directives to Components
4. Component Lifecycle Hooks
5. One-Way Data Binding
6. Testing Components
- 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.