angular2-messages v0.0.2

Angular 2 Form Messages

Allows you to show/hide messages based on form errors

Instalation

1. Add 'angular2-messages/**/*.+(js|css|js.map)' angular-cli-build.js
2. Add the following in system.config.ts

• Add in barrels 'angular2-messages',
• Add in map 'angular2-messages' : 'vendor/angular2-messages'
• Add in packages

  'angular2-messages' : {
     main: 'angular2-messages.js',
     defaultExtension: 'js'
   }

Usage

Import:

import { FORM_MESSAGES_DIRECTIVES } from "angular2-messages";

@Component({
 ...
 directives: [ FORM_MESSAGES_DIRECTIVES ]
 ...
});
...

Add component:

<form [formGroup]="form" method="POST">
  <div class="form-item">
    <label for="email">Email</label>
    <input class="form-control" id="email" formControlName="email" type="email"/>
    <ul [form-messages]="form.controls.email">
      <li form-message="required">Email is required</li>
      <li form-message="emailInvalid">Email is invalid</li>
    </ul>
  </div>
</form>