Chapter 9Here, we create a getFullName interpolation function, from the '{{first}}
{{last}}' string and then call it with a scope object, resulting in fullName
being assigned as 'Pete Bacon Darwin'.
Binding to validation messages
To display the validation error messages in our field templates, we will have
something like this:
<span class="help-inline" ng-repeat="error in $fieldErrors">
{{$validationMessages[error](this)}}
</span>We are repeating over all the validation error keys in $fieldErrors and binding
to the result of calling the validation interpolation function for the given error key.
We have to provide a scope to the interpolation function. We can do
this, in a template, by passing this, which refers to the current scope.
Failing to do this can lead to an unexpected and a difficult time in
debugging errors.The $fieldErrors property contains a list of the current invalid validation error
keys. It is updated by a watch created in the success handler for loadTemplate().
Loading templates dynamically
The loadTemplate function loads in the specified template and converts it to a
jqLite/jQuery wrapped DOM element:
function loadTemplate(template) {
return $http.get(template, {cache:$templateCache})
.then(function(response) {
return angular.element(response.data);
}, function(response) {
throw new Error('Template not found: ' + template);
});
}The function is asynchronous and so it returns a promise to the wrapped element.
Just as directives using templateUrl and ng-include do, we are using the
$templateCache to cache the templates when we load them.