I have a problem trying to dynamically grab the text and send it to my e-mail. It works when manually typing into TS onSendEmail. I am using free email hosting server and the assets folder has required files needed

HTML code

<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> 

Typescript code

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.")
      );
  }

}