Type-safe, signal-powered dynamic forms for Angular. Build complex forms from configuration with full TypeScript inference.
npm install @ng-forge/dynamic-forms
Core library for building type-safe, dynamic Angular forms with signal forms integration.




> Experimental API Notice: This library uses Angular's experimental Signal Forms API.
> Angular may introduce breaking changes in patch releases. Check the compatibility matrix below.
| @ng-forge/dynamic-forms | Angular |
| ----------------------- | ------------- |
| 0.5.x | >=21.1.0 |
| 0.4.x | >=21.1.0 |
| 0.3.x | 21.0.7-21.0.x |
| 0.2.x | 21.0.6 |
| 0.1.1+ | 21.0.2-21.0.5 |
| 0.1.0 | 21.0.0-21.0.1 |
``bash`
npm install @ng-forge/dynamic-forms @ng-forge/dynamic-forms-material
`typescript
// app.config.ts
import { provideDynamicForm } from '@ng-forge/dynamic-forms';
import { withMaterialFields } from '@ng-forge/dynamic-forms-material';
export const appConfig: ApplicationConfig = {
providers: [provideDynamicForm(...withMaterialFields())],
};
`
`typescript
// component.ts
import { DynamicForm, type FormConfig, type InferFormValue } from '@ng-forge/dynamic-forms';
@Component({
imports: [DynamicForm],
template:
,
})
export class UserFormComponent {
config = {
fields: [
{ key: 'email', type: 'input', value: '', label: 'Email', required: true, email: true },
{ key: 'password', type: 'input', value: '', label: 'Password', required: true, minLength: 8, props: { type: 'password' } },
{ type: 'submit', key: 'submit', label: 'Sign In' },
],
} as const satisfies FormConfig; onSubmit(value: InferFormValue) {
console.log('Form submitted:', value); // TypeScript infers: { email: string, password: string }
}
}
`Features
- Signal Forms - Native Angular 21+ signal forms integration
- Type-Safe - Full TypeScript inference with
InferFormValue
- UI Agnostic - Bring your own UI or use official integrations
- Validation - Shorthand validators (required, email, minLength`) and custom validatorsThis core library requires a UI integration. Choose one:
| Package | UI Library |
| ---------------------------------------------------------------------------------------------------- | ---------------- |
| @ng-forge/dynamic-forms-material | Angular Material |
| @ng-forge/dynamic-forms-bootstrap | Bootstrap 5 |
| @ng-forge/dynamic-forms-primeng | PrimeNG |
| @ng-forge/dynamic-forms-ionic | Ionic |
Or create your own.
- Installation
- Field Types
- Validation
- Conditional Logic
- Value Derivation
- Type Safety
- Events
- i18n
- Custom Integrations
See GitHub Releases.
Contributions are welcome! Please read our Contributing Guide.
MIT © ng-forge