Angular4とMaterial2でフォームを提出する

Question

私はAngular 4.0.0でMaterial 2を使用して最初のログインフォームを作成しようとしましたが、Formは提出して機能を起動しません。

<form #UserLogin="ngForm" *ngIf="active" (ngSubmit)="onSubmit(UserLogin.value)"> 
<md-input-container> 
    <input mdInput [(ngModel)]="data.email" ngControl="email" name="email" placeholder="Benutzername" type="text" required> 
</md-input-container> 

<md-input-container> 
    <input mdInput [(ngModel)]="data.password" ngControl="password" name="password" placeholder="Passwort" type="password" required> 
</md-input-container> 

<button md-button class="submit-btn" type="submit" [disabled]="!UserLogin.form.valid">Login!</button> 

送信機能：私は、ログインボタンをクリックすると

onSubmit(value: any) { 

    console.log('sdfdfg'); 

    Object.assign(value, this.additionalData); 
    this.submitted = true; 

    this.auth.login(value).subscribe(
     data => { 
      this.loginSuccess.emit(data); 
     }, 
     error => { 
      for (const field in this.formErrors) { 
       if (this.formErrors.hasOwnProperty(field)) { 

        this.formErrors[field] = []; 
        if (this.validationMessages[field].hasOwnProperty(error.systemCode)) { 
         this.formErrors[field].push(this.validationMessages[field][error.systemCode]); 
        } 
       } 
      } 
     } 
    ); 

} 

は、彼がコンソールにコンソールログを投げるいけません。誰でも構いませんか？

Answer 1

変更ボタンタイプ=「ボタン」

<form #UserLogin="ngForm" (ngSubmit)="onSubmit(UserLogin)"> 
<md-input-container> 
    <input mdInput [(ngModel)]="data.email" name="email" placeholder="Benutzername" class="form-control" type="text" required> 
</md-input-container> 

<md-input-container> 
    <input mdInput [(ngModel)]="data.password" name="password" class="form-control" placeholder="Passwort" type="password" required> 
</md-input-container> 

<button md-button class="submit-btn" type="button" [disabled]="!UserLogin.form.valid">Login!</button> 
</form> 

onSubmit(form: ngForm) { 

console.log('sdfdfg'); 
console.log(form.value); 

}