Angular 2 表单返回空值

Question

我在 Angular 2 中有这个简单的表单。我想获取电子邮件并通过，但我得到一个空对象。

login.component.html

<div class="container">
  <form #formData='ngForm' (ngSubmit)="onSubmit(formData)">
    <div class="form-group row">
      <label for="inputEmail" class="col-sm-2 col-form-label">Email</label>
      <div class="col-sm-10">
        <input type="email" class="form-control" id="inputEmail" placeholder="Email" (ngModel)="email" required>
      </div>
    </div>
    <div class="form-group row">
      <label for="inputPassword" class="col-sm-2 col-form-label">Password</label>
      <div class="col-sm-10">
        <input type="password" class="form-control" id="inputPassword" placeholder="Password" (ngModel)="password" required>
      </div>
    </div>
    <div class="form-group row">
      <div class="offset-sm-2 col-sm-10">
        <button type="submit" class="btn btn-primary" [disabled]="!formData.valid">Sign in</button>
        <a routerLink="/signup">Don't have an account?</a>
      </div>
    </div>
  </form>
</div>

auth.component.ts

@Component({
  templateUrl: 'app/auth/login.component.html'
})
onSubmit(formData) {
      console.log(formData.value);
  }

Answer 1

this.email 和 this.password ngModels 已经包含您需要的信息。

onSubmit(formData) {
      console.log(this.email, this.password);
}