How to do it...

Let's follow the steps below to to add validations to the input fields of our blog post modal:

  1. First, we will need to provide a local property for our ngModel reference on our input. We can also add required, minlength, and maxlength properties to our input for validation:
<div class="form-group">  <label for="formTitleInput" class="form-control-label">Title</label>  <input type="text" class="form-control" id="formTitleInput"      placeholder="New Blog Post Title" name="title"     [(ngModel)]="model.title" #title="ngModel" required     minlength="5" maxlength="140"></div>
  1. Having validation errors without any sort of user feedback isn't very helpful, so we'll add some conditional error classes to our input using the ngClass directive ...

Get MEAN Cookbook now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.