Elastic Email Typescript Angular API Library

Send Transactional Emails

To send transactional emails, you will need Access Level: SendHttp.

When sending transactional emails all recipients will be visible to one another and you will be able to add CC or BCC addresses.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import {HttpClient} from '@angular/common/http';
import { BodyContentType, BodyPart, Configuration, EmailContent, EmailTransactionalMessageData, TransactionalRecipient, EmailsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{

    // Creation of objects to build your email
    var bodyType: BodyContentType = 'PlainText';
    var content: BodyPart = {ContentType: bodyType, Content: "Test", Charset: "utf-8"};
    var body: EmailContent = {Body: [content], From: "<from address>", Subject: "Test123"};
    var recipient: TransactionalRecipient = {To: ["<to address>"]};
    var email: EmailTransactionalMessageData = {Recipients: recipient, Content: body};
  
    // Creation of the Configuration object for Authentication 
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<your API key>"};
	
    // Create the Service object with your http client, base path, and authentication 
    var serv = new EmailsService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.emailsTransactionalPost(email).subscribe((res) => {
	
      // Display the results in the console and on a web page (Both optional)
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

The creation of the different variables used for the email content
use lines 21-25:

• The Body Content Type on line 21 sets the content type, plaintext or HTML
• The Body Part made on line 22 contains the body content type, the content of your email, and the Charset you want to use
• The Email Content on line 23 will contain a list of your body parts, the sender address, and subject of your email
• The Transactional Recipient on line 24 will contain a list of emails that you wish to send the email to
• Finally, the Email Transactional Message Data on line 25 will contain the email content and transactional recipient you made

Create your configuration and set your API key and the base path
using lines 27-29

The service object will be made with line 31

Finally, send your email and view the results using lines 32-35

Viewing the results is not mandatory, lines 33-34 are optional

Find out more by checking our API's documentation

Send Bulk Emails

You will need Access Level: SendHttp.

When sending bulk emails recipients will not be visible to one another and you will not be able to CC or BCC other addresses.

Put the following code to your file:

import { Component, inject, OnInit } from '@angular/core';
import {HttpClient} from '@angular/common/http';
import { BodyContentType, BodyPart, Configuration, EmailContent, EmailMessageData, EmailRecipient, EmailsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
    var bodyType: BodyContentType = 'PlainText';
    var content: BodyPart = {ContentType: bodyType, Content: "Test", Charset: "utf-8"};
    var body: EmailContent = {Body: [content], From: "<from address>", Subject: "Test123"};
    var recipient: EmailRecipient = {Email: "<to address>"};
    var email: EmailMessageData = {Recipients: [recipient], Content: body};
  
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<your API key>"};
	
    var serv = new EmailsService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.emailsPost(email).subscribe((res) => {
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

The creation of the different variables used for the email content
use lines 21-25:

• The Body Content Type on line 21 sets the content type,
  plaintext or HTML
• The Body Part made on line 22 contains the body content type, the content of your email, and the Charset you want to use
• The Email Content on line 23 will contain a list of your body parts, the sender address, and subject of your email
• The Recipient on line 24 will contain the address of your recipient. To send to multiple people, you will have to make many of these objects
• Finally, the Email Message Data on line 25 will contain the email content and a list of recipients you made

Create your configuration and set your API key and the base path
using lines 27-29

The service object will be made with line 31

Finally, send your email and view the results using lines 32-35

Viewing the results is not mandatory, lines 33-34 are optional

Find out more by checking our API's documentation

Add Campaign

To add a campaign, you will need Access Level: ModifyCampaigns.

To add a campaign, put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Campaign, CampaignRecipient, CampaignsService, CampaignTemplate, Configuration } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
    var recipients: CampaignRecipient = {ListNames: ["<list name>"]};
    var template: CampaignTemplate = {From: "<from address>", TemplateName: "<template name>", ReplyTo: "<reply to address>", Subject: "angular campaign"};
    var campaign: Campaign = {Name: "angular campaign", Recipients: recipients, Content: [template]};
  
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<your API key>"};
	
    var serv = new CampaignsService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.campaignsPost(campaign).subscribe((res) => {
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

The creation of the objects used in the campaign use lines 21-23:

• The Recipients on line 21 will take an array of your list names that you want to send to
• The Campaign Template on line 22 will take most of the options, including the sender address, the template name, the reply to (optional), and the email subject
• Finally, the Campaign object on line 23 will take a campaign name, and the recipients and content objects you made previously

Create your configuration and set your API key and the base path
using lines 25-27

The service object will be made with line 29

Finally, create your campaign and view the results using lines 30-33

Viewing the results is not mandatory, lines 31-32 are optional

Find out more by checking our API's documentation

Load Campaign

To load details about a campaign list in your account, you will need Access Level: ViewCampaigns.

To load a campaign, put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { CampaignsService, Configuration } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
   var name = "<your campaign name>";
  
   var config = new Configuration();
   config.basePath = "https://api.elasticemail.com/v4";
   config.credentials = {apikey: "<your API key>"};
 
   var serv = new CampaignsService(this.httpClient, "https://api.elasticemail.com/v4", config);
   serv.campaignsByNameGet(name).subscribe((res) => {
     console.log(JSON.stringify(res));
     this.data = JSON.stringify(res);
   });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Specify your campaign by campaign name on line 21

Create your configuration and set your API key and the base path
using lines 23-25

The service object will be made with line 27

Finally, load your campaign and view the results using lines 28-31

Viewing the results is not mandatory, lines 29-30 are optional

Find out more by checking our API's documentation

Update Campaign

To update existing campaigns in your account, you will need Access Level: ModifyCampaigns.

To update a campaign, put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Campaign, CampaignRecipient, CampaignsService, CampaignTemplate, Configuration } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
    var name = "Draft to Active";
    var recipients: CampaignRecipient = {ListNames: ["<list name>"]};
    var template: CampaignTemplate = {From: "<from address>", TemplateName: "<your template>", ReplyTo: "<reply to address>", Subject: "angular campaign"};
    var campaign: Campaign = {Name: "angular campaign updated", Recipients: recipients, Content: [template]};
	
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<your API key>"};
	
    var serv = new CampaignsService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.campaignsByNamePut(name, campaign).subscribe((res) => {	
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Select the campaign you would like to update by campaign name
using line 21

The creation of the objects used in the campaign use lines 22-24:

• The Recipients on line 22 will take an array of your list names that you want to send to
• The Campaign Template on line 23 will take most of the options, including the sender address, the template name, the reply to (optional), and the email subject
• Finally, the Campaign object on line 24 will take a campaign name, and the recipients and content objects you made previously

Create your configuration and set your API key and the base path
using lines 26-28

The service object will be made with line 30

Finally, update your campaign and view the results using lines 31-34

Viewing the results is not mandatory, lines 32-33 are optional

Find out more by checking our API's documentation

Delete Campaign

To delete an existing campaign, you will need Access Level: ModifyCampaigns.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { CampaignsService, Configuration } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
    var name = "<campaign to delete name>";
	
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<your API key>"};
	
    var serv = new CampaignsService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.campaignsByNameDelete(name).subscribe((res) => {	
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Specify your campaign by campaign name on line 21

Create your configuration and set your API key and the base path
using lines 23-25

The service object will be made with line 27

Finally, delete your campaign and view the results using lines 28-31

Viewing the results is not mandatory, lines 29-30 are optional

Find out more by checking our API's documentation

Load Statistics

To Load delivery statistics from your account, you will need Access Level: ViewReports.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, StatisticsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
   var from = "2024-01-01";
	
   var config = new Configuration();
   config.basePath = "https://api.elasticemail.com/v4";
   config.credentials = {apikey: "<Your API Key>"};
 
   var serv = new StatisticsService(this.httpClient, "https://api.elasticemail.com/v4", config);
   serv.statisticsGet(from).subscribe((res) => { 
     console.log(JSON.stringify(res));
     this.data = JSON.stringify(res);
   });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Set the start date (yyyy-mm-dd) for the stats using line 21

Create your configuration and set your API key and the base path
using lines 23-25

The service object will be made with line 27

Finally, load your statistics and view the results using lines 28-31

Viewing the results is not mandatory, lines 29-30 are optional

Find out more by checking our API's documentation

Load Channels Statistics

To load statistics for each channel from your account, you will need Access Level: ViewChannels.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, StatisticsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
   var config = new Configuration();
   config.basePath = "https://api.elasticemail.com/v4";
   config.credentials = {apikey: "<Your API Key>"};
 
   var serv = new StatisticsService(this.httpClient, "https://api.elasticemail.com/v4", config);
   serv.statisticsChannelsGet().subscribe((res) => { 
     console.log(JSON.stringify(res));
     this.data = JSON.stringify(res);
   });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Create your configuration and set your API key and the base path
using lines 21-23

The service object will be made with line 25

Finally, load your statistics and view the results using lines 26-29

Viewing the results is not mandatory, lines 27-28 are optional

Find out more by checking our API's documentation

Load Campaign Statistics

To load statistics for each email campaign from your account, you will need Access Level: ViewChannels.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, StatisticsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
   var config = new Configuration();
   config.basePath = "https://api.elasticemail.com/v4";
   config.credentials = {apikey: "<Your API Key>"};
 
   var serv = new StatisticsService(this.httpClient, "https://api.elasticemail.com/v4", config);
   serv.statisticsCampaignsGet().subscribe((res) => { 
     console.log(JSON.stringify(res));
     this.data = JSON.stringify(res);
   });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Create your configuration and set your API key and the base path
using lines 21-23

The service object will be made with line 25

Finally, load your statistics and view the results using lines 26-29

Viewing the results is not mandatory, lines 27-28 are optional

Find out more by checking our API's documentation

Add Contacts

To Add contacts to your account, you will need Access Level: ModifyContacts

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, ContactPayload, ContactsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
   var listname = "My List";
   var contactPayload: ContactPayload = {Email: "<address to add>"};
 
   var config = new Configuration();
   config.basePath = "https://api.elasticemail.com/v4";
   config.credentials = {apikey: "<Your API Key>"};
 
   var serv = new ContactsService(this.httpClient, "https://api.elasticemail.com/v4", config);
   serv.contactsPost([contactPayload], [listname]).subscribe((res) => { 
     console.log(JSON.stringify(res));
     this.data = JSON.stringify(res);
   });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Set the list name you want to add contacts to using line 21

Create a Contact Payload object with email you want to add using line 22

Create your configuration and set your API key and the base path
using lines 24-26

The service object will be made with line 28

Finally, add the contact and view the results using lines 29-32

Viewing the results is not mandatory, lines 30-31 are optional

Find out more by checking our API's documentation

Add Contacts Bulk

To Add contacts to your account, you will need Access Level: ModifyContacts

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, ContactPayload, ContactsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void {
    this.SendCall();
  }

  SendCall(): void{
    var listname = "My List";

    var contactList: ContactPayload[] = [];
    contactList.push({Email: "<contact address 1>"});
    contactList.push({Email: "<contact address 2>"});
    contactList.push({Email: "<contact address 3>"}); 

    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<your API key>"};
	
    var serv = new ContactsService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.contactsPost(contactList, [listname]).subscribe((res) => {
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Set the list name you want to add contacts to using line 21

Create a Contact Payload object array using line 23

Populate the list with your contact emails using lines 24-26

Create your configuration and set your API key and the base path
using lines 28-30

The service object will be made with line 32

Finally, add the contacts and view the results using lines 33-36

Viewing the results is not mandatory, lines 34-35 are optional

Find out more by checking our API's documentation

Delete Contacts

If you want to delete a contact, you will need Access Level: ModifyContacts.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, ContactsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
   var address = "<address to delete>";
	
   var config = new Configuration();
   config.basePath = "https://api.elasticemail.com/v4";
   config.credentials = {apikey: "<Your API Key>"};
 
   var serv = new ContactsService(this.httpClient, "https://api.elasticemail.com/v4", config);
   serv.contactsByEmailDelete(address).subscribe((res) => { 
     console.log(JSON.stringify(res));
     this.data = JSON.stringify(res);
   });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Select the contact you want to delete by email using line 21

Create your configuration and set your API key and the base path
using lines 23-25

The service object will be made with line 27

Finally, delete the contact and view the results using lines 28-31

Viewing the results is not mandatory, lines 29-30 are optional

Find out more by checking our API's documentation

Export Contacts

If you want to export the selected contact to a downloadable file, you will need Access Level: Export

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, ContactsService, ExportFileFormats } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
   var fileFormat: ExportFileFormats = "Csv";
	
   var config = new Configuration();
   config.basePath = "https://api.elasticemail.com/v4";
   config.credentials = {apikey: "<your API key>"};
 
   var serv = new ContactsService(this.httpClient, "https://api.elasticemail.com/v4", config);
   serv.contactsExportPost(fileFormat).subscribe((res) => { 
     console.log(JSON.stringify(res));
     this.data = JSON.stringify(res);
   });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Select the file format you want to receive using line 21

Create your configuration and set your API key and the base path
using lines 23-25

The service object will be made with line 27

Finally, export your contacts and view the results using lines 28-31

Viewing the results is not mandatory, lines 29-30 are optional

Find out more by checking our API's documentation

Add List

To Add a list, you will need Access Level: ModifyContacts.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, ListPayload, ListsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
   var listPayload: ListPayload = {ListName: "Angular List"};
	
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<your API key>"};
   
    var serv = new ListsService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.listsPost(listPayload).subscribe((res) => {   
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
     });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Create the list payload object using line 21

Create your configuration and set your API key and the base path
using lines 23-25

The service object will be made with line 27

Finally, add your list and view the results using lines 28-31

Viewing the results is not mandatory, lines 29-30 are optional

Find out more by checking our API's documentation

Load List

To Load a list, you will need Access Level: ViewContacts.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, ListsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
    var listName = "Angular List";
	
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<your API key>"};
 
    var serv = new ListsService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.listsByNameGet(listName).subscribe((res) => { 
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Specify the list by list name using line 21

Create your configuration and set your API key and the base path
using lines 23-25

The service object will be made with line 27

Finally, load your list and view the results using lines 28-31

Viewing the results is not mandatory, lines 29-30 are optional

Find out more by checking our API's documentation

Delete List

To Remove a contact list from your account, you will need Access Level: ModifyContacts.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, ListsService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
    var listName = "Angular List";
	
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<your API key>"};
	
    var serv = new ListsService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.listsByNameDelete(listName).subscribe((res) => {	
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Specify the list by list name using line 21

Create your configuration and set your API key and the base path
using lines 23-25

The service object will be made with line 27

Finally, delete your list and view the results using lines 28-31

Viewing the results is not mandatory, lines 29-30 are optional

Find out more by checking our API's documentation

Add Template

To add a template, you will need Access Level: ModifyTemplates.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { BodyPart, Configuration, TemplatePayload, TemplatesService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
    var bodyPart: BodyPart = {ContentType: "HTML", Content: "<p>Test email content</p>", Charset: "utf-8"};
    var templatePayload: TemplatePayload = {Name: "Angular Template", Body: [bodyPart]};
  
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<Your API Key>"};
	
    var serv = new TemplatesService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.templatesPost(templatePayload).subscribe((res) => {	
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Create the template Body Part object using line 21. This will contain the Content Type, the Content of your email, and the charset

Also create the Template Payload object with your body part object and template name using line 22

Create your configuration and set your API key and the base path
using lines 24-26

The service object will be made with line 28

Finally, create your template and view the results using lines 29-32

Viewing the results is not mandatory, lines 30-31 are optional

Find out more by checking our API's documentation

Load Template

To load existing template details, you will need Access Level: ViewTemplates.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, TemplatesService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{
    var name = "Angular Template";
  
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "your API key"};
	
    var serv = new TemplatesService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.templatesByNameGet(name).subscribe((res) => {	
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Specify the template by template name using line 21

Create your configuration and set your API key and the base path
using lines 23-25

The service object will be made with line 27

Finally, load your template and view the results using lines 28-31

Viewing the results is not mandatory, lines 29-30 are optional

Find out more by checking our API's documentation

Delete Template

To delete a template, you will need Access Level: ModifyTemplates.

Put the following code into your file:

import { Component, inject, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Configuration, TemplatesService } from 'elasticemail-angular';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  title = 'libtest15';
  httpClient = inject(HttpClient);
  data: any;

  ngOnInit(): void{
    this.SendCall(); 
  }

  SendCall(): void{

    // Creation of a variable to specify template name
    var name = "Angular Template";
  
    // Creation of the Configuration object for Authentication
    var config = new Configuration();
    config.basePath = "https://api.elasticemail.com/v4";
    config.credentials = {apikey: "<your API key>"};
	
    // Create the Service object with your http client, base path, and authentication 
    var serv = new TemplatesService(this.httpClient, "https://api.elasticemail.com/v4", config);
    serv.templatesByNameDelete(name).subscribe((res) => {
	
      // Display the results in the console and on a web page (Both optional)
      console.log(JSON.stringify(res));
      this.data = JSON.stringify(res);
    });
  }
}

Load the library and other dependencies using lines 1-3

Mark the class as a component with lines 5-9

Set the webpage title, inject the http client, and create the data field using lines 12-14. The data field is optional, but can be shown on the webpage

ngOnInit is used to call the function on page load in this example
using lines 16-18

Specify the template by template name using line 21

Create your configuration and set your API key and the base path
using lines 23-25

The service object will be made with line 27

Finally, delete your template and view the results using lines 28-31

Viewing the results is not mandatory, lines 29-30 are optional

Find out more by checking our API's documentation