ngx-query-builder

ngx-query-builder is a modern Angular library for building visual query editors with a rich, customizable UI. It provides a standalone component that integrates seamlessly with Angular forms, enabling developers to create domain-specific query interfaces with minimal boilerplate.

Key Features

• Standalone Component — Works with ngModel and Reactive Forms via ControlValueAccessor and Validator interfaces.
• Extensive Templating Hooks — Customize every UI fragment (field selectors, operators, buttons, icons) with structural directives.
• Entity-Aware Field Grouping — Organize fields by entities and configure rule defaults out of the box.
• Expand/Collapse Support — Nested rule sets with customizable icons and transitions.
• Built-in Operator Coercion — Handles multi-select and custom operator resolution with hooks for value handling.
• Themeable CSS — Accessible, BEM-ish class names that can be themed directly or swapped via classNames input.

Philosophy

The project emphasizes sensible defaults paired with deep customization, allowing developers to build query interfaces that match their domain without sacrificing flexibility or Angular integration.