johnrsimoneau

<form novalidate [formGroup]="bookForm">

  <h1>Reactive Form Example</h1>

  <div class="group">
    <label for="title">Book Title * </label>
    <input type="text"
      [class.error]="!bookTitle.valid && bookTitle.touched"
      [formControl]="bookTitle"
      id="title" 

johnrsimoneau

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators, AbstractControl, FormControl } from '@angular/forms';

@Component({
  selector: 'app-reactive-form',
  templateUrl: './reactive-form.component.html'
})
export class ReactiveFormComponent implements OnInit {

  constructor(private fb: FormBuilder) { }

johnrsimoneau

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

import { AppComponent } from './app.component';
import { ReactiveFormComponent } from './reactive-form/reactive-form.component';

@NgModule({
  declarations: [
    AppComponent,