Implementing Nested Directives
The final example illustrates how you can nest directives within each other and have them interact. Nesting directives is a great way to provide a parent context and container for custom elements that are related to each other. In this example the outer directive myPhotos
acts as a container that can contain child directives named myPhoto
.
Listing 7.5 implements two custom directives: myPhotos
and myPhoto
. The myPhotos
directive is designed to be a container for the myPhoto
directive. Notice that lines 7–18 define a controller that provides the functionality for the myPhotos
directive, including an addPhoto()
function. Because the code uses require:'^myPhotos'
in the myPhoto
directive, you can also call the addPhoto() ...
Get Learning AngularJS now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.