This project was generated with Angular CLI version 1.3.2.
Angular 2 offers two form-building technologies: reactive forms and template-driven forms. The example below leverages reactive forms which creates forms in a reactive style. Reactive forms facilitate a reactive style of programming which favors the management of data flowing between a non-ui data model and a UI-oriented form model. It retains the states and values of the HTML controls on the screen. With reactive forms, a tree of Angular Form control objects are created in the component class and binded to the native form control elements in the component template.
In order to run the application please go to project directory and run npm run install. Once this is complete please follow instructions on how to run the development server. A working demo of the application can be seen here:
- Validation exceptions are added dynamically based on user input.
- Reset button defaults all input values and validation exceptions.
- User is not able to submit input until validation exceptions are cleared.
- Success message is displayed once all validation exceptions are cleared. At that point user may submit form.
- All empty user input values will display an error indicating an empty field.
- Username must be all characters and between 5 and 15 length.
- Age must be between 18 and 118 and be a positive integer.
- Password and confirm must both match and have their values hidden.
Form Control: Tracks the value and validity status of an individual form control. It corresponds to an HTML form control such as an input box or selector.
Form Group: Tracks the value and validity state of a group of AbstractControl instances. The group's properties include its child controls. The top-level form in your component is a FormGroup.
Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.
Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the -prod flag for a production build.
Run ng test to execute the unit tests via Karma.
Run ng e2e to execute the end-to-end tests via Protractor.
Before running the tests make sure you are serving the app via ng serve.
To get more help on the Angular CLI use ng help or go check out the Angular CLI README.