Angular 表單不會動態發送數據

Question

我在嘗試動態獲取文本並將其發送到我的電子郵件時遇到問題。 它在手動輸入 TS onSendEmail 時起作用。 我正在使用免費的電子郵件托管服務器，並且資產文件夾有所需的文件

HTML 代碼

<form (ngSubmit)="onSendEmail(addEmailForm)" #addEmailForm ="ngForm">
  <fieldset>
    <legend>Contact us</legend>
    <label>Your name</label>  <br>
    <input ngModel  name="name" type="text" placeholder="Your name" size="20" required ><br> 
    <label>E-mail address</label>  <br>
    <input ngModel  name="email" type="text" placeholder="example@example.com" size="20" required><br>
    <label>Subject</label>  <br>
    <input ngModel  name="subject" type="text" size="20"><br>
    <label>Body</label>  <br>
    <textarea ngModel  name="body" type="text" cols="40" rows="6" required></textarea><br>
    <button [disabled]="addEmailForm.invalid" >Send</button>
    </fieldset>
</form> 

打字稿代碼

import { HttpClient } from '@angular/common/http';
import { Component, OnInit, AfterViewInit } from '@angular/core';
import { NgForm } from '@angular/forms';


declare let Email: any;
import 'src/assets/smtp.js';  // available in assets folder


@Component({
  selector: 'app-map',
  templateUrl: './shops.component.html',
  styleUrls: ['./shops.component.css']
})
export class ShopsComponent implements OnInit, AfterViewInit {

  constructor(private http: HttpClient) { }

  ngOnInit(): void { }  

  body: any
  subject: any;
  email: any;
  name: any;
 

  onSendEmail(addEmailForm: NgForm) {
    Email.send({
      Host : "smtp.elasticemail.com",
      Username : "myemail@hotmail.com",
      Password : "mypassword",
      To : 'mysecondemail@hotmail.com',
      Name: this.name,    
      From : this.email,     // when I write these manually the email gets sent
      Subject : this.subject,
      Body : this.body,
        }).then( 
    (message: any) => alert("E-mail sent, thank you.")
      );
  }

}

Answer 1

要從您那里獲取填充數據，您應該使用：

  onSendEmail(addEmailForm: NgForm) {
let data = addEmailForm.value;
//...
}