Odd way of getting $formatters to run in a directive #12022
Description
I spent hours reading through documentation, blog entries, and Stackoverflow questions to try and answer the question, "How do you get $formatters to run and update the view in directives?".
There is no clear answer that I could find. The directive demo on the documentation page itself doesn't even use any of the $parsers, $formatters, etc on the very page.
Regardless, I was able to get it to work like this: http://plnkr.co/edit/R7HkCJhmJ43KK03LkOmU
app.directive('uppercase', [
function () {
return {
require: 'ngModel',
link: function ($scope, $element, $attr, $controller) {
$controller.$parsers.push(function (viewValue) {
return viewValue.toLowerCase();
});
$controller.$formatters.push(function (modelValue) {
return modelValue.toUpperCase();
});
$controller.$viewChangeListeners.push(function () {
$controller.$modelValue = '';
});
}
}
}
]);
Setting the $controller.$modelValue to an empty string triggers the formatters and automatically updates the view without needing to call $setViewValue, $render, etc.
I believe this is the closest approach to how most people imagine this should all work, but it is in no way obvious that this should work at all.
I'm not sure if I should submit a pull request to update the documentation for this example, or if there is a better way to do it and this should be fixed.