In this video, Aviv Ben-Yosef explains the benefits of isolated directives and demonstrates the process of isolating an existing directive in a safe manner.
- [Instructor] The newly created Todo Directive…specified scope: true in its definition.…That means the directive will create the new,…nonisolated child scope.…Unfortunately, nonisolated scopes…can access all of their parents' properties.…The Todo Directive is accessing a deleteTodo function,…which requires reading through the code…in order to understand where it was declared.…Isolated directives are easier to maintain…because they're isolated.…A child scope does not inherit from its parent…and only has the properties it defines…and its bindings.…
Writing isolated directives has been the standard…for a few years now.…There are quite a few steps to take in order…to isolate a directive and avoid breaking anything.…First, I will need to find every usage…of dollar scope in the controller…and every expression in the template…like ng-bind.…I then need to determine which properties…that are being accessed don't originate…in the current controller.…Those will need to be passed as bindings…from the parent directive to the child one.…
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.