javascript - ngSubmit 経由で送信する場合、Angular フォームは未定義です

Question

以下のように app.component.html ファイルにフォームの概要が示されています。[送信] ボタンをクリックしてフォームを送信すると、Javascript で chatForm が未定義であるというエラーが表示されます。

いくつかの異なるチュートリアルを見てきましたが、この関数が期待どおりに動作しない理由がわかりません。私は何を間違っていますか？

また、フォームを送信するときに、フォームにある入力の値を取得するにはどうすればよいですか? フォームにの名前がmessage定義されていますが、この変数をどのように使用できますか?

app.component.html

<div class="container">
    <h2>Message Form</h2>
    <form (ngSubmit)="sendMessage(chatForm)" #chatForm="ngForm">
        <div>
            <label for="message">Message</label>
            <input type="text" id="message" name="message" [(ngModel)]="message" required>
        </div>
        <button type="submit" id="sendmessage" [disabled]="!chatForm.valid">
            Send
        </button>
    </form>
</div>

app.component.ts

public sendMessage(form): void {
    console.log("Message sent: " + form.value);
}