Guides
GuidesExamplesGitterLog In
Guides

formlyValidationMessages

service

This service allows you to control what messages gets added to each field's validation.messages which can ultimately be used in an ng-messages context to great effect. It has a messages property which is what is used to attach the messages to the field's config. The messages here should be set as angular expressions (or functions) similar to how expressionProperties or validators works. You can always interact with messages on your own, but there are two helper methods in this service

addTemplateOptionValueMessage

formlyValidationMessages.addTemplateOptionValueMessage(name, prop, prefix, suffix, alternate);
// for example
formlyValidationMessages.addTemplateOptionValueMessage('max', 'max', 'The max value allowed is', '', 'Too big');
formlyValidationMessages.addTemplateOptionValueMessage('minlength', 'minlength', '', 'is the minimum length', 'Too short');
formlyValidationMessages.addTemplateOptionValueMessage('pattern', 'patternValidationMessage', '', '', 'Invalid Input');

// the last could be used like so:
var field = {
  type: 'whatever',
  templateOptions: {
    pattern: /some_crazyPattern/,
    patternValidationMessage: '"Needs to match " + options.templateOptions.pattern'
  }
};

addStringMessage

formlyValidationMessages.addStringMessage(name, string);
// for example
formlyValidationMessages.addStringMessage('required', 'This field is required');

messages

The methods above simply create a function and add it to the messages property on this service. So, you can do this yourself for maximum flexibility

formlyValidationMessages.messages.required = getRequiredMessage;

function getRequiredMessage($viewValue, $modelValue, scope) {
  if (scope.data.useGenericMessage) {
    return 'This field is required';
  } else {  
	  return scope.to.label + ' is required';
  }
}

Sponsor