how to pass a value from a field in angular using form?

Question

When a button is clicked I wanted to pass the value of the input field which has the formControlName email to the function , can someone give me an idea or help ? thank.

#html code

<div>
                    <div fxLayout="column">
                        <mat-form-field class="full-width" appearance="fill" style="margin-top: 20px;">
                            <mat-label>Username</mat-label>
                            <input matInput placeholder="" autocomplete="email" formControlName="email">
                            <mat-error *ngIf="modelForm.get('email').hasError('required')">
                                Username is required.
                            </mat-error>
                        </mat-form-field>
                    </div>
                    <div style="text-align: right;">
                        <button (click)="getStarted()" mat-flat-button color="primary"
                            type="submit" class="v-btn-sml" id="get-started-button">
                            Submit
                        </button>
                    </div>

#.ts

  getStarted() {
    // I want to pass the input value from the username field here when button is clicked
  }

  private Form(): FormGroup {
    return this.formBuilder.group({
      id: [this.model.id || 0],
      email: new FormControl(this.model.email, [Validators.required]),
    });
  }

Hello Art. Would this be sufficient to answer your question? https://stackoverflow.com/questions/43713558/how-to-get-a-single-value-from-formgroup — Mikkel Christensen, Jul 02 '21 at 10:49
would appreciate Sir if you could provide an example based on my example . thanks. — Art McAhon, Jul 02 '21 at 10:52

score 3 · Accepted Answer · answered Jul 02 '21 at 10:56

3

Assuming you have defined modelForm as a property on your component,

getStarted(){
    const value = this.modelForm.value['email'];
}

answered Jul 02 '21 at 10:56

alvaromartmart

61
2

score 2 · Answer 2 · answered Jul 02 '21 at 10:57

2

u can achieve it this way:

getStarted() {
   const inputValue = this.modelForm.get('email').value
  }

answered Jul 02 '21 at 10:57

gil

2,388
1
21
29

how to pass a value from a field in angular using form?

2 Answers2