Mastering Web Application

Chapter 9

We copy in the labelContent and apply the for attribute to the label element:

element.append(templateElement);

$compile(templateElement)(childScope);

childScope.$field = inputElement.controller('ngModel');

});

We append the templateElement to the original field element, then use the
$compile service to compile and link it to our new childScope. Once the element is
linked, the ngModelController is available for us to put into the $field property
for the template to use.

Summary

In this chapter we have looked at some of the more advanced aspects of developing
directives. We saw in our alert directive, how transclusion can be used with
ng-transclude when creating widgets. The accordion directive suite neatly
demonstrated how directive controllers can be used to coordinate communication
between directives. We even took complete control of the compile process by
terminating the current compilation in the field directive and the using the
$compile service to manually compile the element's contents.

In the next chapter we will be looking at what we can do to ensure that our
application performance is fast and responsive.