Agent skill · software engineering · aiskillstore
delon-form-dynamic-schema-forms
Create dynamic schema-based forms using @delon/form (SF component). Use this skill when building complex forms with validation, conditional rendering, async data loading, custom widgets, and multi-step workflows. Ensures forms follow JSON Schema standards, integrate with Angular reactive forms, support internationalization, and maintain consistent validation patterns across the application.
Why this skill is useful
Provides specific patterns and code snippets for creating dynamic forms with @delon/form that are not commonly found in general documentation.
What it needs
Requires @angular/core, @delon/form installed locally. About 6k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.
What this skill does
@delon/form Dynamic Schema Forms Skill This skill helps create dynamic forms using @delon/form's SF (Schema Form) component. Core Principles Schema-Driven Forms JSON Schema: Define forms declaratively with JSON Schema Type Safety: Full TypeScript support for schema definitions Validation: Built-in validation with custom validators Dynamic Rendering: Conditional fields based on form state Key Features Automatic form generation from schema Custom widgets for specialized inputs Async data loading (dropdowns, autocomplete) Multi-step forms (wizards) Responsive grid layouts Internationalization support Basic Schema Form Common Widgets String Input Textarea Number Input Date Picker Date Range Select Dropdown Multi-Select Autocomplete Radio Buttons Checkbox Switch Slider File Upload Async Data Loading Dynamic Dropdown Options Cascading Selects Conditional Fields Show/Hide Based on Value Custom Validators Multi-Step Forms (Wizards) Grid Layout Responsive Layout Form Actions Checklist When creating SF forms: [ ] Use proper JSON Schema types [ ] Define required fields [ ] Set validation rules (min/max, format, pattern) [ ] Use appropriate widgets for data types [ ] Handle async data loading [ ] Implement conditional field visibility [ ] Add custom validators when needed [ ] Configure responsive grid layout [ ] Handle form submission and errors [ ] Provide loading states [ ] Test form validation [ ] Ensure accessibility (labels, ARIA) References @delon/form Documentation JSON Schema Specification SF Component API ng-alain Component Skill
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills aiskillstore/delon-form-dynamic-schema-forms