Submit JSON with Angular

Use the Submit JSON JS Client to wire up a contact us form submission notification using AngularJS.

Set up your Angular project

  1. To get started, make sure you have a working Angular project. If you do not, get started here.
  2. Then install submitjson with your favorite package manager.
pnpm add submitjson # OR npm i OR yarn add

Integrate Submit JSON with Angular

Next initialize the Submit JSON JS client and handle the contact us form submission in your Angular component:

import { Component } from '@angular/core'
import { FormBuilder, FormGroup, Validators } from '@angular/forms'
import SubmitJSON from 'submitjson'

const sj = new SubmitJSON({ apiKey: 'sjk_xxx', endpoint: 'xxx' })

  selector: 'app-contact-form',
  templateUrl: './contact-form.component.html',
export class ContactFormComponent {
  contactForm: FormGroup

  constructor(private formBuilder: FormBuilder) {
    this.contactForm = this.formBuilder.group({
      name: ['', Validators.required],
      email: ['', [Validators.required, Validators.email]],
      message: ['', Validators.required]

  async onSubmit() {
    if (this.contactForm.valid)
      await sj.submit(this.contactForm.value)
<form [formGroup]="contactForm" (ngSubmit)="onSubmit()">
    <label for="name">Name</label>
    <input type="text" id="name" formControlName="name">
    <label for="email">Email</label>
    <input type="email" id="email" formControlName="email">
    <label for="message">Message</label>
    <textarea id="message" formControlName="message"></textarea>
  <button type="submit" [disabled]="!contactForm.valid">Send Message</button>

🚛✨💚 Nice job, you successfully integrated Submit JSON with Angular.