Form-create-component NPM

Create Form Component

O que é?

É um componente composto por elementos <ion-input> com funções de cadastros, sendo eles: Usuário.

Para sua utilização, é necessário a importação do componente

npm install componente

declarar no módulo desejado

imports: [CreateFormModule]

inicialização do mesmo napágina desejada

constructor(public formUsername: FormUsername) {}

e a relização da chamada no arquivo de visão

<form-username [username]="this.username" (usernameReturn)="this.setUsername($event)"></form-username>.

Parâmetros

Os parâmetros podem ser informados para garantir a personalização no nível desejado. Sendo os parâmetros:

Tag	Descrição	Default	Tipo	Retorno
required	Configura o campo como obrigatório	true	boolean	-
maxLength	Define a quantidade máxima de caractéres	25	number	-
minLength	Define a quantidade mínima de caractéres	5	number	-
pattern	Define o padrão que será validado	`^(?=.[a-zA-Z])(?=.[0-9])[a-zA-Z0-9]+$`	string(REGEX)	-
username	Variável que será preenchida	-	String	-
styleDivInputText	Estilo do campo de texto	`{ "display": "flex" , "align-items": "center", "margin-top": "5px", "padding": "0", "background": "var(--ion-color-primary)", "border-radius": "0.5em"}`	string (JSON)	-
styleUserIcon	Estilo do campo do ícone	`{ "color": "var(--ion-color-primary-contrast)", "float": "left", "font-size": "20px", "margin-left": "3px" }`	string (JSON)	-
styleInputText	Estilo do texto	`{ "color": "var(--ion-color-primary-contrast)" }`	string (JSON)	-
styleDivErrors	Estilo da div contendo as mensagens de erro	`{"display": "flex", "flex-direction":"column", "justify-content": "center", "align-items": "center" }`	string (JSON)	-
styleDivErrorMessage	Estilo das mensagens de erro	`{"font-size": "0.9em", "margin-top": "3px", "color": "var(--ion-color-danger)" }`	string (JSON)	-
errMsgRequired	Mensagem de erro para usuário obrigatório	`Username is required`	string	-
errMsgMinlength	Mensagem de erro para quantidade mínima de caractéres	`Username must be at least 5 characters long.`	string	-
errMsgMaxlength	Mensagem de erro para quantidade máxima de cararactéres	`Username cannot be more than 25 characters long`	string	-
errMsgpattern	Mensagem de erro exibida para informar o padrão do usuário	`Your username must contain only numbers and letters`	string	-
errMsgValidUsername	Mensagem de erro para usuário inválido	`Your username has already been taken`	string	-
usernameReturn	Método callback para retornar o valor da entrada e se está válido ou não		Método Callback	`{ username : String ;valid : Boolean;}`