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.passwordngModel s已包含您所需要的信息。

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