Update: Source code can be found here:
Often while building Angular applications, we build Angular Template Form which maps to our REST API request/response JSON object. We also apply some CSS library like Twitter Bootstrap for nicer look and feel of form. This process may get cumbersome if you are building some CRM or data entry specific application.
To save some developer efforts, I have built a website which generate source code of Angular Template form from given JSON object. As an output you shall get HTML form code with Twitter Bootstrap classes added, Typescript code for new member variables used for data binding with HTML controls and “submit” method.
Angular Template Form Builder
Generate Angular Template Driven From from JSON object angular-form-builder.surge.sh
- Enter your JSON object in text box
- Click on “Submit” button
- “Output” section will show generated Angular Template Form
- “Template Form HTML” section will show HTML source code which can be copy pasted in your Angular application
- “Template Form Typescript” section will show Typescript code, especially new member variables which are used for [(ngModel)] data binding. Also “onSubmit()” method shall be generated with “formValues” JSON argument. This variable shall hold complete form data in JSON object.
- “Reset” button shall reset application and will be ready for next form generation.
I will try to extend this application in future by adding more features.