HiI have a form in angular that will have upload file on submit I want to add that file to the email message attachments how to do thatthe email messagevar message new MailMessage From new MailAddress34ramiwahdan1978gmailcom34 Subject 34Call Back Request34 IsBodyHtml true if you need to include attachmentsmessageAttachmentsAddnew Attachment34CUsersramitOneDriveDesktopprojectslistpdf34 messageToAddcallRequestEmailTo

Hi ramitaherwahdRefer the following stepsCreate a new Angular application using the following commandng new angularemailappcd angularemailappng serveImport the ReactiveFormsModule into your AppModuleimport ReactiveFormsModule from 39angularforms39NgModule imports ReactiveFormsModuleexport class AppModule Create a form componentimport FormBuilder FormGroup FormControl Validators from 39angularforms39export class EmailFormComponent implements OnInit FormData FormGroup constructorprivate builder FormBuilder ngOnInit thisFormData thisbuildergroup EmailAddress new FormControl3939 ValidatorscomposeValidatorsrequired Validatorsemail Body new FormControl3939 Validatorsrequired To send emails from the front endIn your emailformcomponentts create a function that sends the emailsubmitEmail const emailData to 39recipientexamplecom39

Send email with attachment in Angular

ramitahe...

SOLVED CLOSED ACTIVE ANSWERED
User: ramitaherwahdan1978
Posted: on Apr 29, 2024 06:37 AM
Forum: Angular
Answer: 1
Views: 2486

Hi,

I have a form in angular that will have upload file, on submit I want to add that file to the email message attachments, how to do that?

the email message:

var message = new MailMessage()
 {
     From = new MailAddress("ramiwahdan1978@gmail.com"),
     Subject = "Call Back Request",
     IsBodyHtml = true,
 };
 
 // if you need to include attachments
message.Attachments.Add(new Attachment("C:/Users/ramit/OneDrive/Desktop/projects-list.pdf"));
 
 message.To.Add(callRequest.Email.ToString());
 
 var theUser = message.From.User;
 
 message.Body =
     $"""
     <html>
         <body>
             <h2>Hi, {theUser}</h2>,
             <p>
                 Thank you very much for your call, we will call you within 2 working days!
             </p>
         </body>
     </html>
     """;
 
 var smtp = new SmtpClient("smtp.gmail.com")
 {
     Port = 587,
     Credentials = new NetworkCredential(message.From.ToString(), "pqwq yoam bfpd pdjg"),
     EnableSsl = true
 };
  
 smtp.Send(message);

in the code above this is the code that includes the attachment:

message.Attachments.Add(new Attachment("C:/Users/ramit/OneDrive/Desktop/projects-list.pdf"));

in the angular form I have:

<form id="stripe-login">
    <div class="field padding-bottom--24">
      <label for="fname">Publication Name</label>
      <input type="text" name="fname" id="fname" [(ngModel)]="pname">
    </div>
 
    <div class="field padding-bottom--24">
      <input type="file" id="myFile" [(ngModel)]="filename">
    </div>
 
    <div class="field padding-bottom--24">
      <input (click)="publishNews()" type="submit" name="submit" value="Continue">
    </div>
</form>

on submit I want to get that file full path into my email message attachment, how?

Download FREE API for Word, Excel and PDF in ASP.Net

dharmend...

0 1

Reply
ANSWER
User: dharmendr
Replied: on Apr 29, 2024 08:28 AM
Report

Hi ramitaherwahd...,

Refer the following steps.

Create a new Angular application using the following command.

ng new angular-email-app
cd angular-email-app
ng serve

Import the ReactiveFormsModule into your AppModule.

import { ReactiveFormsModule } from '@angular/forms';

@NgModule({
  imports: [ReactiveFormsModule],
})
export class AppModule {}

Create a form component.

import { FormBuilder, FormGroup, FormControl, Validators } from '@angular/forms';

export class EmailFormComponent implements OnInit {
  FormData: FormGroup;

  constructor(private builder: FormBuilder) {}

  ngOnInit() {
    this.FormData = this.builder.group({
      EmailAddress: new FormControl('', [Validators.compose([Validators.required, Validators.email])]),
      Body: new FormControl('', [Validators.required]),
    });
  }
}

To send emails from the front end.

In your email-form.component.ts, create a function that sends the email.

submitEmail() {
  const emailData = {
    to: 'recipient@example.com',
    subject: 'Your Subject',
    body: this.FormData.value.Body,
  };
}

To add an attachment, you will need to handle file uploads and include the attachment data in your email request.

Modify the submitEmail function to include the attachment.

submitEmail() {
  const emailData = {
    to: 'recipient@example.com',
    subject: 'Your Subject',
    body: this.FormData.value.Body,
    attachment: 'base64-encoded-file-content'
  };
}

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html

Send email with attachment in Angular

Company

Explore

Follow us

Contact Us