angular:forms
문서의 이전 판입니다!
Forms
Vital to business applications Create an experience that guides the user e1fficiently and effectively through the workflow. Developers
- Data binding
- Change tracking
- Validation
- Visual feedback
- Error messages
- Form submission
Angular Forms Template Driven Forms
- Heavy on the component template
Reactive Forms
- Heavy on the component class
Template Driven Forms (TDF)
- Easy to use and similar to Angular JS Forms
- Two way data binding with ngModel
- Bulky HTML and minimal component code
- Automatically tracks the form and form elements state and validity
- Unit testing is a challenge –> 브라우저
- Readablility decreases with complex forms and validations
- Suitable for simple scenarios
Track Control State and validity
적용되는 class는
{{ name.className }}
로 확인 가능하다.
| State | Class if true | Class if false |
|---|---|---|
| The control has been visited. | ng-touched | ng-untouched |
| The control's value has changed. | ng-dirty | ng-pristine |
| The control's value value is valid. | ng-valid | ng-invalid |
ngModel properties
| Class | Property |
|---|---|
| ng-untouched | untouched |
| ng-touched | touched |
| ng-pristine | pristine |
| ng-dirty | dirty |
| ng-valid | valid |
| ng-invalid | invalid |
angular/forms.1547616398.txt.gz · 마지막으로 수정됨: 2025/04/15 10:05 (바깥 편집)