Chapter 8
} else {
return updateModel;
}
};The onSelect() handler calls our updateModel() function, which passes the new
date value into the $parsers pipeline via $setViewValue():
var setUpDatePicker = function () {
var options = scope.$eval(attrs.datePicker) || {};
options.onSelect = onSelectHandler(options.onSelect);
element.bind('change', updateModel);
element.datepicker('destroy');
element.datepicker(options);
ngModelCtrl.$render();
};ngModelCtrl.$render = function () {
element.datepicker("setDate", ngModelCtrl.$viewValue);
};scope.$watch(attrs.datePicker, setUpDatePicker, true);
}
};
});Summary
In this chapter we looked at a variety of common patterns for defining, testing, and
implementing directives. We saw how to integrate with the ngModel to implement
validation, how to write a reusable encapsulated widget, and how to wrap a third
party widget in an AngularJS directive. Throughout the chapter testing has been
promoted and we looked at common strategies for testing directives in AngularJS.
In the next chapter we will take a deeper look into building directives, looking
at some of the more advanced features such as transclusion, and compiling our
own templates.