source

컨트롤러에서 양식 값을 읽는 방법은 무엇입니까?

ittop 2023. 6. 26. 23:12
반응형

컨트롤러에서 양식 값을 읽는 방법은 무엇입니까?

저는 Angular 2 초보자인데 구성 요소에서 텍스트 상자 값을 얻으려고 하는데 어떻게 얻는지 정말 모르겠습니다.

HTML:

<form [formGroup]="regForm" >
                <label for="txtFName">First Name</label>
                <input type="text" id="txtFName"/>
</form>

component.ts :

import { Component } from "@angular/core"
import { FormControl, FormGroup, FormBuilder, Validator, Validators,ReactiveFormsModule } from "@angular/forms";
import { customer } from '../model/customerModel'
import { Router } from "@angular/router";

export class regComponent
{
    private Customer:customer;
    private regForm:FormGroup;
    private firstName:FormControl;

    constructor (private formBuilder:FormBuilder,private router:Router)
    {

        this.firstName=new FormControl('',[Validators.required])

        this.regForm=formBuilder.group({
        firstName:this.firstName
    })

console.log(this.regForm.value);
}

콘솔에 빈 값이 표시됩니다.이와 관련하여 도와주시기 바랍니다.

더하다formControlName입력할

<input type="text" id="txtFName" formControlName="firstName" />

이제 이름으로 값에 액세스합니다.

this.regForm.get('firstName').value

아래 컨트롤의 경우 명명된 전자 메일:

ngOnInit() {
    this.contactForm = this.formBuilder.group({
      email: [null, Validators.compose([Validators.required])]
    });
  }

에 의한 액세스name당신이 통제실에 준 것:

this.formGroup.controls['email'].value

import { Component, OnInit } from '@angular/core';
import { FormBuilder, Validators } from '@angular/forms';


@Component({
  selector: 'demo-app',
  templateUrl: 'app/app.component.html'
})

export class regComponent implements OnInit {

private regForm:any;
    constructor(private formBuilder: FormBuilder) { 
    }
    ngOnInit(){
        this.regForm=formBuilder.group({
          firstName:['', Validators.required]
         })
    }

     saveUser() {
        if (this.regForm.dirty && this.regForm.valid) {
          alert(`FirstName: ${this.regForm.value.firstName}`);
        }
      }
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<form [formGroup]="regForm" (submit)="saveUser()" >
          <label for="txtFName">First Name</label>
          <input type="text" id="txtFName"  formControlName="firstName" #firstName="ngControl"/>
          <button type="submit" [disabled]="!userForm.valid">Submit</button>
        </form>

언급URL : https://stackoverflow.com/questions/47827634/how-to-read-form-values-in-controller

반응형