单击按钮时如何获取我在文本框中输入的值？

Question

.HTML

<input type="email" #inputvalue>
<button type="submit" (submit)="onSubmit(inputvalue.value)">Verify</button>

.TS

export class LoginComponent implements OnInit {
   inputvalue: any;

   onSubmit(inputvalue: any) {
   this.inputvalue = inputvalue;
   console.log(this.inputvalue)
  }
}

• I want to get the values that I entered in textbox to inputvalue variable after click the verify button.

Answer 1

As Anurag has mentioned in his comment you should go and learn a bit about Angular . There are two ways you can achieve this:

HTML

<input type="email" [(ngModel)]="emailValue">
<input type="email" #email>
<button (click)="submit()">Verify</button>

TS

import { Component, ViewChild, ElementRef } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {

  emailValue: string;
  @ViewChild('email', {static: true}) email: ElementRef;

  submit() {
   console.log(this.emailValue)
   console.log(this.email.nativeElement.value)
  }
}

Stackblitz

Answer 2

Also instead of ngModel TWO way binding you can use formControlName = "emailValue" , You just need a parent FormGroup in html. You can read about using FormGroup online. It is better and maintainable as compared to ngModel