
Luis Fernando Niño Gonzalez
Preguntacomponent.ts
this.datos = formBuilder.group({ totalIngresos: new FormControl('', {validators: [Validators.required, Validators.pattern("^[0-9]\d*$")], updateOn: 'blur'}), actividadLaboral: new FormControl('', {validators: Validators.required}), nombreEmpresa: new FormControl('', {validators: Validators.required}), tipoContrato: new FormControl('', {validators: Validators.required}), ocupacionIndependiente: new FormControl('', {validators: Validators.required}), ciudad: new FormControl('', {validators: Validators.required}), recibioAyudaSlct: new FormControl('', {validators: Validators.required}), codigoAsesor: new FormControl('', {validators: Validators.required}), aceptaAutorizaciones: new FormControl('', {validators:Validators.required}) }, {updateOn: 'change'});
component.html
<form [formGroup]="datos" class="data-form" (ngSubmit)="datosCredito(datos.value)" novalidate> <label class="cform">¿Cuál es el valor total de sus ingresos mensuales?</label> <input type="text" onkeypress="return event.charCode >= 48 && event.charCode <= 57 || event.charCode >= 0 && event.charCode <= 32" placeholder="$5.000.000" formControlName="totalIngresos"> <label class="cform">¿Cuál es su actividad laboral actual?</label> <div class="select"> <select size="1" formControlName="actividadLaboral"> <option value="" selected>Seleccionar...</option> <option *ngFor="let actLab of actividadLaboralList" [value]="actLab.code">{{actLab.description}}</option> </select> <div class="select_arrow"></div> </div><!--select--> <!-- if is Empleado--> <div id="data-md1" [ngStyle]="{display: mostrarEmpleado ? 'block' : 'none'}"> <label class="cform">¿Cúal es el nombre de su empresa?</label> <input type="text" placeholder="Banco Davivienda" formControlName="nombreEmpresa"> </div> <div id="data-md2" [ngStyle]="{display: mostrarEmpleado ? 'block' : 'none'}"> <label class="cform">¿Qué tipo de contrato tiene?</label> <div class="select"> <select size="1" formControlName="tipoContrato"> <option value="" selected>Seleccionar...</option> <option *ngFor="let tipCon of tipoContratoList" [value]="tipCon.code">{{tipCon.description}}</option> </select> <div class="select_arrow"></div> </div><!--select--> </div> <!-- if is Independiente--> <div id="data-md3" [ngStyle]="{display: mostrarIndependiente ? 'block' : 'none'}"> <label class="cform">¿Cuál es su actividad como independiente?</label> <div class="select"> <select size="1" formControlName="ocupacionIndependiente"> <option value="" selected>Seleccionar...</option> <option *ngFor="let ocuInd of ocupacionIndependienteList" [value]="ocuInd.code">{{ocuInd.description}}</option> </select> <div class="select_arrow"></div> </div><!--select--> </div> <label class="cform">¿Cúal es su ciudad de residencia?</label> <input id="ciudad" type="text" placeholder="Bogotá, Bogotá D.C." formControlName="ciudad" [ngbTypeahead]="search" [resultFormatter]="formatMatches" [inputFormatter]="formatMatches"/> <label class="cform">¿Ha recibido ayuda de un asesor del Banco? (Opcional)</label> <div class="select"> <select size="1" formControlName="recibioAyudaSlct"> <option value="" selected>Seleccionar...</option> <option value="S">Sí, recibí ayuda de un asesor.</option> <option value="N">No recibí ayuda de un asesor.</option> </select> <div class="select_arrow"></div> </div><!--select--> <!-- if is Recibio ayuda --> <div id="data-md4" [ngStyle]="{display: recibioAyuda ? 'block' : 'none'}"> <label class="cform">Ingrese el código del asesor:</label> <div class="input-group-code"> <input type="text" placeholder="15454545454" onkeypress="return event.charCode >= 48 && event.charCode <= 57 || event.charCode >= 0 && event.charCode <= 32" formControlName="codigoAsesor" > <ng-template #htmlMensajeAyuda> <div [innerHtml] = "mensajeAyudaPopup">Texto de prueba</div> </ng-template> <button type="button" class="btn data-popup" placement="bottom" [ngbPopover]="htmlMensajeAyuda" triggers="mouseenter:mouseleave" #p="ngbPopover" (click)="p.toggle()"> <i class="fa fa-info" aria-hidden="true"></i> </button> </div> </div> <div class="input-group-check"> <div class="control-group"> <label class="control control-checkbox"> Acepto las autorizaciones <strong (click)="mostrarPDF('1')">AQUÍ</strong> descritas con relación a la consulta de mi información. <input type="checkbox" checked="checked" formControlName="aceptaAutorizaciones" /> <div class="control_indicator"></div> </label> </div> </div> <div class="row"> <div class="col-md-4 col-md-offset-4 col-sm-4 col-sm-offset-4 col-xs-6 col-xs-offset-3"> <input type="submit" class="graybtn" [disabled]="!datos.valid" value="Continuar" /> </div> </div> </form>``` Dependiendo de la selección de los combos me muestra otros campos y no se como validarlos. Gracias