En mi aplicación, tengo dos campos de entrada. Uno es un campo mat-option y el otro es un campo de entrada regular. Lo que quiero es que cuando seleccione una opción del campo mat-option (Proveedor), quiero que esa opción aparezca en el campo de entrada normal (Asunto). El código que he escrito hasta ahora está debajo. En este momento, no pude hacerlo funcionar. ¿Qué tengo que hacer?
HTML:
<mat-form-field appearance="outline" fxFlex="100" fxFlex.gt-xs="30" class="w-100-p" ngClass.gt-xs="pr-4"> <mat-label>Supplier</mat-label> <mat-select formControlName="Supplier"> <mat-option *ngFor="let sp of supplierList" [value]="sp"> {{sp.SupplierName}} </mat-option> </mat-select> <mat-icon matSuffix class="secondary-text">person</mat-icon> </mat-form-field> </div> <div fxLayout="row" fxLayoutAlign="start center"> <mat-form-field appearance="outline" fxFlex fxFlex.gt-xs="60"> <mat-label>Subject</mat-label> <input matInput formControlName="Subject" maxlength="150" required > <mat-icon matSuffix>short_text</mat-icon> </mat-form-field> </div>TS:
ngOnInit(): void { // Reactive Form this.form = new FormGroup({ Subject: new FormControl("", [ Validators.required, Validators.maxLength(150), ]), Supplier: new FormControl( this.previousReqest ? this.previousReqest.Supplier : "", Validators.required ), }); this.form.controls["Supplier"].valueChanges .subscribe(data => { this.form.controls['Subject'] = data; }); if ( UserInformation.userAuthorizedRoutes && UserInformation.userAuthorizedRoutes.length > 0 ) { this.userRights = UserInformation.userAuthorizedRoutes.filter((x) => new RegExp(x.Action).test(this._router.routerState.snapshot.url) )[0]; } this.initializeUserSettings(); }Puede subscribe al evento valueChanges en el momento de la inicialización.
this.form.controls["Supplier"].valueChanges .subscribe(data => { if(data){ this.form.controls['Subject'].setValue(data.SupplierName); } });this.form.get('Subject').value es de solo lectura, si desea establecer un valor para un control de formulario, debe usar .setValue(value) , ¿puede probar esto y ver si funciona?
this.form.get('Subject').setValue(data)