POST JSON from a service with secret from environment.ts (build-time injection via CI).

Mount outside Angular zone if you see double renders—rare with embed.

Run mount only in browser (isPlatformBrowser).

MuxForms on Angular loads embed.js in src/index.html, places data-form-id on a template ref in ContactComponent, and calls window.MuxForms.mount in ngAfterViewInit. Allow your deployed SPA origin.

Docs

Angular

Angular apps need an explicit mount after the view renders—embed.js does not guess your component lifecycle.

Angular

Piece	Detail
index.html	defer script
ContactComponent	ViewChild + AfterViewInit
Router	Component recreated per visit
Allowlist	Production SPA URL

contact.component.ts

import { AfterViewInit, Component, ElementRef, ViewChild } from "@angular/core";

@Component({
  selector: "app-contact",
  template: `<h1>Contact</h1><div #host data-form-id="FORM_UUID"></div>`,
})
export class ContactComponent implements AfterViewInit {
  @ViewChild("host") host!: ElementRef<HTMLDivElement>;

  ngAfterViewInit() {
    window.MuxForms?.mount(this.host.nativeElement);
  }
}

src/index.html

<script src="https://www.muxforms.com/embed.js" defer></script>

Common questions

Standalone components?: Same AfterViewInit pattern.
HttpClient submit?: POST JSON from a service with secret from environment.ts (build-time injection via CI).
Zone.js?: Mount outside Angular zone if you see double renders—rare with embed.
Ivy SSR?: Run mount only in browser (isPlatformBrowser).

Enterprise SPA, simple intake.

One mount hook on the contact route.

Upgrade to Pro