Reactive

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

Template Driven

• single
• multi
• init-class

Nested FormBuilder

Name
Date
Summary
Franchise

Nested Controls

Budget
International
Domestic
Worldwide

Reset Controls
Update Controls

Nested FormBuilder Results

Form Value

{
  "name": "Avengers: Endgame",
  "releaseDate": "26/04/2019",
  "franchise": true,
  "summary": "After the devastating events of Avengers: Infinity War (2018), the universe is in ruins.",
  "boxoffice": {
    "budget": 356000000,
    "worldwide": 2797800564,
    "international": 1939427564,
    "domestic": 858373000
  }
}

Nested Controls Value

{
  "budget": 356000000,
  "worldwide": 2797800564,
  "international": 1939427564,
  "domestic": 858373000
}