Canopy Sort Code — Best Practices
SkillDev toolsBest practices for the Canopy Sort Code directive. Trigger when capturing and validating UK bank sort codes in a form in an Angular project using Canopy.
Available today. Use it from your connected AI after setup.
No other account needed.
Connect ahel once, and every AI you use reads what you have installed.
Then ask your AI: use the Canopy Sort Code — Best Practices skill
What this skill tells your AI
The instructions your AI receives, as published by legal-and-general/canopy in skills/best-practice/forms-sort-code/SKILL.md and read by ahel’s review.
This skill provides usage guidance for the Canopy lgSortCode directive from @legal-and-general/canopy.
Apply this skill whenever you capture or validate a UK bank sort code.
Import
import {
LgSortCodeDirective,
LgInputFieldComponent,
LgInputDirective,
LgHintComponent,
} from '@legal-and-general/canopy';
Basic Usage
Both lgInput and lgSortCode must be present on the same <input> element. Always include the exact hint text shown below.
<lg-input-field>
Sort code
<lg-hint>Must be 6 digits long, for example 00-00-00</lg-hint>
<input lgInput lgSortCode formControlName="sortCode" />
</lg-input-field>
Validation
The lgSortCode directive automatically applies required and pattern validators. The pattern validator accepts:
000000— six contiguous digits00 00 00— digits separated by spaces00-00-00— digits separated by hyphens
On blur, the value is auto-formatted to 00-00-00.
For displaying validation error messages, use the LgValidationComponent — see the forms-validation skill.
Design Constraints
- Always copy the exact hint text: "Must be 6 digits long, for example 00-00-00".
- Use with Angular reactive forms.
Signals
- GitHub stars
- 23
- Forks
- 46
- Last commit
- Sep 2026
Advanced
- Catalog kind
- skill
- Gateway key
canopy-forms-sort-code- Source
- github.com/legal-and-general/canopy