@talenra/components documentation
  1. Directives
  2. SocialSecurityNumberDirective

File

input/src/social-security-number/social-security-number.directive.ts

Description

The directive is applied to an InputComponent (<input talenra-input talenra-social-security-number />) to support users entering social security numbers (Swiss OASI/AHV/AVS numbers).

  • Prefill the input-field with the prefix it gets focus.
  • Auto-format input values

You might want to limit the input value to 16 characters (the length of a Swiss OASI/AHV/AVS number including separators).

Example :
<talenra-form-field label="AHV-Nummer">
  <input talenra-input talenra-social-security-number formControlName="socialSecurityNumber" type="text" maxlength="16" />
</talenra-form-field>

You might want to use InputValidator.socialSecurityNumber to validate the input.

Example :
form: FormGroup = new FormGroup({
 socialSecurityNumber: new FormControl('', [InputValidators.socialSecurityNumber]),
});

Example for a valid input: 756.9217.0769.85

Import

Example :
import { SocialSecurityNumberDirective } from '@talenra/components/input';

See InputValidators.socialSecurityNumber

../../../#/input

Implements

OnInit

Metadata

Providers SocialSecurityNumberPipe
Selector input[talenra-input][talenra-social-security-number], input[talenra-search][talenra-social-security-number]

results matching ""

    No results matching ""