मैं Angular 2+ में नया हूं और बुनियादी फॉर्म सबमिट में परेशानी हो रही है। हालांकि मैं कोणीय का उपयोग कर रहा हूं, मैं यह जानना चाहता हूं कि मैं सबमिट बटन का उपयोग करके केवल एक फॉर्म कैसे जमा कर सकता हूं। प्रस्तुत करने का तुच्छ तरीका।
<form action="/api/profile/me" method="post">
<input type="submit"/>
</form>
सबमिट बटन पर क्लिक करने के बाद भी मैं ब्राउज़र को सर्वर से संवाद करने की कोशिश नहीं कर सकता।
मैं इस विशिष्ट रूप की घटनाओं को नहीं सुनने के लिए कोणीय कैसे बना सकता हूं?
आप सभी को धन्यवाद।
उत्तर:
जवाब के लिए 0 № 1कोणीय में एक रूप बनाने के तरीके हो सकते हैं
आप प्रतिक्रियाशील रूपों के साथ जा सकते हैं और इस अच्छे टैटू का पालन कर सकते हैं
https://code.tutsplus.com/tutorials/introduction-to-forms-in-angular-4-reactive-forms--cms-29787
<form novalidate (ngSubmit)="onSubmit(profile)" [formGroup]="profile">
<input type="email" placeholder="E-mail" formControlName="email" class="form-control">
// add your coustome message here
</form>
और घटक ts फ़ाइल में
this.profile = this.fb.group({
email: [null, [Validators.required]]
})
जवाब के लिए 0 № 2
आप रिएक्टिव फॉर्म का उपयोग करने की कोशिश कर सकते हैं।
सबसे पहले, App.module.ts में ReactiveFormsModule जोड़ें।
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
@NgModule({
imports: [
CommonModule,
LoginRoutingModule,
FormsModule,
ReactiveFormsModule
],
फिर, app.componenet.html में फ़ॉर्म टैग जोड़ें।
<form [formGroup]="rForm" (ngSubmit)="addPost(rForm.value)">
<input type="text" formControlName="email" placeholder="Email">
<button type="submit" [disabled]="!rForm.valid">LOGIN</button>
</form>
और अंतिम app.componenet.ts फ़ाइल को इस तरह दिखना चाहिए:
import { FormBuilder, FormGroup, Validators, FormControl, FormArray } from "@angular/forms";
export class AppComponent implements OnInit {
rForm: FormGroup;
constructor(private fb: FormBuilder){
this.rForm = fb.group({
"email": [null, Validators.compose([Validators.required, Validators.email])] });
}
addPost(post) {
console.log(post);
}
}