A
Anonymous

Custom Input Component - Copy this Angular, Css Component to your project

necesito que me hagas los test de este componente import { Component, Input } from '@angular/core'; import { AbstractControl, ControlValueAccessor } from '@angular/forms'; import { CONTROL_VALUE_ACCESSOR } from './utils/const-proveedor.util'; @Component({ selector: 'app-custom-input', templateUrl: './custom-input.component.html', styleUrl: './custom-input.component.scss', providers: [ CONTROL_VALUE_ACCESSOR ], }) export class CustomInputComponent implements ControlValueAccessor { /** * label - label del input */ @Input() label = ""; /** * id - valor del for , name y id del input */ @Input() id = ""; /** * classStyle - estilo personalizado del padre */ @Input() classStyle = ""; /** * control - controlador del formGroup */ @Input() control?: AbstractControl<string | null, string | null> | null; /** * control - tipo de campo. Text , number y email */ @Input() type = ""; value = ""; isDisable = false; onChange?: (value: string) => void; onTouched?: () => void; writeValue(value: string): void { this.value = value; } registerOnChange(fn: (value: string) => void): void { this.onChange = fn; } registerOnTouched(fn: any): void { this.onTouched = fn; } setDisabledState?(isDisabled: boolean): void { this.isDisable = isDisabled; } onInputChange(event: Event): void { const input = event.target as HTMLInputElement; this.onChange?.(input.value); } }

Prompt
Component Preview

About

Custom Input Component - A versatile input field with customizable label, ID, and styles. Built with Angular and CSS. Download instantly!

Share

Last updated 1 month ago