Use Angular's reactive forms or template-driven forms with Flowqen's API endpoint. Works with any Angular version.
Go to flowqen.com/create and create a form in 10 seconds. No account needed. Copy the form ID from the URL.
The simplest approach — just paste this HTML into your Angular project:
<form action="https://flowqen.com/api/f/YOUR_FORM_ID" method="POST">
<input type="text" name="name" placeholder="Name" required />
<input type="email" name="email" placeholder="Email" required />
<textarea name="message" placeholder="Message" required></textarea>
<button type="submit">Send</button>
</form>Use Angular's native patterns for a better developer experience:
import { Component } from "@angular/core";
import { HttpClient } from "@angular/common/http";
@Component({
selector: "app-contact",
template: `
<form (ngSubmit)="onSubmit()">
<input [(ngModel)]="name" name="name" placeholder="Name" required />
<input [(ngModel)]="email" name="email" type="email" placeholder="Email" required />
<textarea [(ngModel)]="message" name="message" placeholder="Message" required></textarea>
<p *ngIf="status">{{ status }}</p>
<button type="submit">Send</button>
</form>
`,
})
export class ContactComponent {
name = ""; email = ""; message = ""; status = "";
constructor(private http: HttpClient) {}
onSubmit() {
this.http.post("https://flowqen.com/api/f/YOUR_FORM_ID", {
name: this.name, email: this.email, message: this.message,
}).subscribe({ next: () => this.status = "Sent!", error: () => this.status = "Error" });
}
}Submit a test entry. Go to your Flowqen dashboard to see the submission. Set up email notifications, Slack alerts, or any of our 22+ integrations.