0.0.9 • Published 10 months ago
transit-registration-form v0.0.9
Angular Registration Form Library
This library provides a customizable registration form for Angular applications.
Compatibility
Angular Version | Compatible? |
---|---|
11.0.0+ | ✅ |
below 11.0.0 | ❌ |
Installation
You can install the library using npm:
npm i transit-registration-form
Usage
- Import the RegistrationFormModule in your application's module:
import { RegistrationFormModule } from 'transit-registration-form';
@NgModule({
declarations: [AppComponent],
imports: [BrowserModule, AppRoutingModule, RegistrationFormModule],
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}
- Use the lib-registration-form component in your Angular template:
<lib-registration-form
backgroundImage=""
imageSrc=""
apiLink=""
selectedLanguage="en"
formTitle="Sign Up"
submitButton="Sign Up"
[firstName]="true"
[lastName]="true"
[fullName]="false"
[userName]="true"
[email]="true"
[gender]="true"
[phoneNumber]="true"
[ssn]="true"
[passportNumber]="false"
[birthday]="false"
[password]="true"
[confirmPassword]="true"
></lib-registration-form>
The lib-registration-form component take the following:
- backgroundImage (string): The URL of the background image for the registration form.
- imageSrc (string): The URL of the image to display in the registration form.
- apiLink (string): The API for submitting the registration form.
- selectedLanguage (string): take ar for Arabic and en for English.
- formTitle (string): take form title like Registrayion or Sign UP.
- submitButton (string): take submit button content.
- firstName (boolean): Enable/disable the first name field.
- lastName (boolean): Enable/disable the last name field.
- userName (boolean): Enable/disable the username field.
- email (boolean): Enable/disable the email field.
- gender (boolean): Enable/disable the gender field.
- ssn (boolean): Enable/disable the social security number field.
- passportNumber (boolean): Enable/disable the passport number field.
- birthday (boolean): Enable/disable the birthday field.
- password (boolean): Enable/disable the password field.
- confirmPassword (boolean): Enable/disable the confirm password field.
Note: Set the input values based on your specific requirements. Note: the form contain the next inputs by default
- firstName.
- lastName.
- userName.
- email.
- password.
- confirmPassword. you can remove this input by set to it false value like userName="false" and you can add more inputs like you need like this phoneNumber="true".