Angular Formly

• whoami: tristola
• whatdoido: Software Engineer
• github: https://github.com/tristola

My Background with Angular

• "Full-Stack" Developer
• Started with
  • Angular-seeds
  • Generators (yeoman/slushjs)
  • Few MEAN-stack prototypes
  • Moved to using browserify
• Two years with AngularJS
• Three projects done to production

What is angular-formly

• Forms rendered by javascript from json model
  • Can include javascript or expressions
• Premade templates for
  • Bootstrap
  • LumX
  • Vanilla html
  • Ionic (mobile development)

General Idea

• Render form from json model (originally)
  • Can include functions or expressions too
• Write your own custom html templates for form item types
• It is rendered in browser

Example json

[{ "type": "input", "key": "email", "templateOptions": { "type": "email", "placeholder": "jane doe", "label": "First name2" } }]

The good

• If specifications change, forms are easy to change
• Not much technical expertise is required to change the model
• Pre made templates - or do your own
• You could make a form editor
• You could possibly migrate to other implementation later, since model is abstract
  • Like react-formly

The bad

• Performance is a factor for very large forms
  • After over 1000 lines of json, performance will suffer
• Hard to find bottlenecks in the performance
• Limits the form UI
  • some things become hard to implement
  • others impossible
• I have been using versions 1.0 -> 3.2.7
  • latest is 7.2.1

The Ugly

• If formly does not do what you need, you need to fork
  • Forking makes updates hard
  • Instead try to contribute
• Cannot get the event when form has been rendered
  • Initial render can take long
• With large forms rendering is slow
  • Initial render is slow, after that form is responsive

When to use

• When prototyping

• When you have a lot of forms to write or they change often

  • Possibly store forms to backend
  • If you store your models in datastore

• When you might need to change the form per user

  • Different forms for age-groups / marriage status
  • Different form for different times of day

When not to use

• If your forms are very complex and large
  • You can get into performance problems
• When your model is very static
  • You could generate forms on the backend
• If you have only few forms
• When you want to have very snappy performance

Questions

Any questions?