コンソールには印刷できません

Question

私は新しく、反応性のあるフォームを実装しようとしています。以下は私のhtmlコードとTSコードここ

<form [formGroup]="signupForm" (ngSubmit)="onSubmit()"> 
    <div class="form-group"> 
    <label for="email">Mail</label> 
    <input type="email" name="email" id="email" formControlName="email" class="form-control"> 
    </div> 
    <div class="btn btn-primary" type="submit">Sign Up</div> 
</form> 

は私がOnSubmitの方法でやろうとしていますコンソール上で何かを印刷することはできませんいくつかの理由で私のTSファイル

import { Component , OnInit} from '@angular/core'; 
import {FormControl, FormGroup, Validators} from '@angular/forms'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent implements OnInit{ 
    title = 'app works!'; 
    signupForm : FormGroup; 

    ngOnInit(){ 
    this.signupForm = new FormGroup({ 
     'email' : new FormControl('test@test.com') 

    }); 

    // this.signupForm.valueChanges.subscribe(
    // (value) => console.log(value) 
    //); 
    } 


    onSubmit(){ 
    console.log(this.signupForm); 
    } 

} 

されています。私はすべてをチェックし、それは大丈夫だったが、私はボタンを押しても何もコンソールには来ない。 誰でも助けてもらえますか？間違っていますか？

Answer 1

属性タイプはdiv要素の有効な型ではありません。この場合、コールバックがトリガーされるように、タイプsubmitを持つ入力またはボタンが必要になります。

<form [formGroup]="signupForm" (ngSubmit)="onSubmit()"> 
    <div class="form-group"> 
     <label for="email">Mail</label> 
      <input type="email" 
       name="email" 
       id="email" 
       formControlName="email" 
       class="form-control"> 
    </div> 
    <button class="btn btn-primary" type="submit">Sign Up</button> 
</form>