JSFiddle - React, Tailwind, and code Playground
JavaScript
app.directive('modelOnblur', function() {
'use strict';
return {
restrict: 'A',
require: 'ngModel',
link: function(scope, elm, attr, ngModelCtrl) {
var allowedTypes = ['text', 'email', 'password'];
if (allowedTypes.indexOf(attr.type) === -1) {
return;
}
// Unbind onchange event so that validation will be triggerd
// at onblur
elm.unbind('input').unbind('keydown').unbind('change');
// Set OnBlur event listener
elm.bind('blur', function() {
scope.$apply(function() {
ngModelCtrl.$setViewValue(elm.val());
});
});
}
};
});