Reactive

List of Forms

• Prototype
• form-control
• form-control-class
• form-group
• form-builder
• form-builder-nested
• form-array
• form-multi

Template Driven

• single
• multi
• init-class

Form Control

Form Group

Form Builder

Result With formControl

ExampleForm1 : Value

name : "Darth Vader"
email : "darthvader@starwars.com"
job : "Sith"
comment : "Father of Luke Skywalker"

Reactive Form with FormControl

• Name

• Email

• Job

  • Jedi
  • Sith

• Comment

• SetValue

• Reset

Result with FormGroup & FormControl

ExampleForm2 : Value

{
  "name": "",
  "email": "",
  "job": "",
  "comment": ""
}

Reactive Form with FormGroup & FormControl

• Name
• Email
• Job
  • Jedi
  • Sith
• Comment

• SetValue
• PatchValue
• Reset

Result with FormBuilder

ExampleForm3 : Value

[object Object]

Reactive Form with FormBuilder

• Name
• email
• Job
  • Jedi
  • Sith
• Comment

• Load
• Reset