AlphaDash
The Alpha Dash rule allows letters, numbers, dashes (-), and underscores (_) — everything a URL-safe username or slug typically needs, while still blocking spaces and other punctuation. It's the standard choice for fields like usernames, URL slugs, file names, and API identifiers, where dashes and underscores are common separators but stray symbols or whitespace would break the value elsewhere in the system. Pair it with the alpha rule when you need pure letters, or alpha_numeric when dashes and underscores shouldn't be allowed at all.
#Directive Code Snippet
<!DOCTYPE html>
<html lang="en">
...
<form (ngSubmit)="onSubmit(form)" #form="ngForm">
<input alphaDash type="text" name="<name>" [(ngModel)]="<name>" #<name>="ngModel">
<ng-absolute-validator [formInstance]="<name>"></ng-absolute-validator>
</form>
...
</html>
#Chain Rule Code Snippet
<!DOCTYPE html>
<html lang="en">
...
<form (ngSubmit)="onSubmit(form)" #form="ngForm">
<input [Rule]="alpha_dash" type="text" name="<name>" [(ngModel)]="<name>" #<name>="ngModel">
<ng-absolute-validator [formInstance]="<name>"></ng-absolute-validator>
</form>
...
</html>
#Reactive Form Code Snippet
//component.ts
export class ReactiveComponent{
public form !: FormGroup;
constructor(
private fb : FormBuilder,
private rv : ReactiveValidator,
){this.generteForm()}
generteForm(){
this.form = this.fb.group({
<name> : ['',this.rv.map('alpha_dash',<CUSTOM_MESSAGE>)],
})
}
}
//component.html
<!DOCTYPE html>
<html lang="en">
...
<form [formGroup]="form">
<input type="text" name="<name>" formControlName="<name>">
<ng-absolute-validator [formInstance]="form.get(<name>)"></ng-absolute-validator>
</form>
...
</html>