Directive components in ngMessages

ngMessages is a directive that is designed to show and hide messages based on the state of a key/value object that it listens on. The directive itself compliments error message reporting with the ngModel $error object (which stores a key/value state of validation errors).

ngMessage is a directive with the purpose to show and hide a particular message. For ngMessage to operate, a parent ngMessages directive on a parent DOM element must be situated since it determines which messages are visible based on the state of the provided key/value map that ngMessages listens on.