Angular படிவங்களுக்கு இரண்டு அணுகுமுறைகளை வழங்குகிறது. டெம்ப்ளேட்-இயக்கப்பட்ட படிவங்கள் எளிமையானவை மற்றும் HTML இல் வரையறுக்கப்பட்டுள்ளன; வினைத்திறன் படிவங்கள் TypeScript இல் வரையறுக்கப்பட்டுள்ளன மற்றும் மேலும் கட்டுப்பாட்டை வழங்குகின்றன — சிக்கலான, இயக்கமான அல்லது கடுமையான சரிபார்ப்பு படிவங்களுக்கு சிறந்தவை.
<form #f="ngForm" (ngSubmit)="onSubmit(f.value)">
<input name="email" ngModel required email /> <!-- ngModel registers the field -->
<input name="password" ngModel required minlength="8" />
<button [disabled]="f.invalid">Submit</button>
</form>
படிவ கட்டமைப்பு மற்றும் சரிபார்ப்பு ngModel নির்দেশങ்கள் மூலம் டெம்ப்ளேட்டில் வாழ்கின்றன. அமைப்பது எளிமையாக இருக்கிறது, ஆனால் படிவ மாதிரி மறைமுகமாகவும் சோதிக்க/நிரல்படி கையாள கடினமாகவும் இருக்கிறது.
import { FormBuilder, Validators } from "@angular/forms";
export class SignupComponent {
constructor(private fb: FormBuilder) {}
form = this.fb.group({
email: ["", [Validators.required, Validators.email]],
password: ["", [Validators.required, Validators.minLength(8)]],
});
onSubmit() {
if (this.form.valid) console.log(this.form.value);
}
}
<form [formGroup]="form" (ngSubmit)="onSubmit()">
<input formControlName="email" />
<input formControlName="password" type="password" />
<button [disabled]="form.invalid">Submit</button>
</form>
படிவம் ஒரு স்பष்ட பொருள் (FormGroup/FormControl) ஆகும் நீங்கள் TS இல் கட்டுகிறீர்கள். இது அதை கவனிக்கக்கூடியதாக, சோதனையுக்கு தகுதியுடையதாக, மற்றும் கையாளுவதற்கு எளிதாக்குகிறது (வயல்களைச் சேர்க்கவும்/நீக்கவும், valueChanges மூலம் மாற்றங்களுக்குப் பதிலளிக்கவும்).
Template-driven Reactive
Where defined HTML (ngModel) TypeScript (FormBuilder)
Form model implicit/async explicit, synchronous object
Validation directives in template validators in code
Dynamic forms hard easy (add/remove controls in code)
Testability harder straightforward (it's just an object)
Best for simple forms complex/dynamic/validated forms
this.form.get("email")!.valueChanges.subscribe(v => ...); // react to changes
this.form.valid; // synchronous validity check
சரியான படிவ அணுகுமுறையைத் தேர்ந்தெடுப்பது பராமரிப்பের জন்য முக்கியம்: டெம்ப்ளேட்-இயக்கப்பட்ட விரைவான, எளிய படிவங்களுக்கு; வினைத்திறன் எதையும் சிக்கலாக — பல-படி வழிகாட்டிகள், இயக்கமான வயல் தொகுப்புகள், குறுக்கு-வயல் சரிபார்ப்பு, அல்லது அலகு சோதனைகள் தேவைப்படும் படிவங்கள்.
வினைத்திறன் படிவங்களின் வெளிப்படையான, கவனிக்கக்கூடிய மாதிரி பொதுவாக தீவிர பயன்பாடுகளில் விரும்பப்படுகிறது, ஏனெனில் இது மேலும் சக்திশালியாக, சோதனையுக்கு தகுதியுடையதாக, மற்றும் அளவிடக்கூடியதாக இருக்கிறது, இருப்பினும் இது அதிகமான முன்கோடு தேவைப்படுகிறது.
விரிவான பதில்களுடன் கூடிய IT நேர்காணல் கேள்விகளின் நூலகம் — Junior முதல் Senior வரை.
நன்கொடை