FormBuilder中的设置值无法正确显示

编程问答 2022-10-31

问题描述

我正在使用Electron和Angular开发桌面应用程序。我正在为登录建立第二个窗口。我的想法是，如果有用于登录的保存值，请在登录表单中显示它们。所以，我正在做的是当我将第二个窗口部署到电子中时，通过以下方式将保存的值（如果存在）发送到第二个窗口：

secondWindow.once('ready-to-show',() => {
    secondWindow.show()
    secondWindow.webContents.send('savedConfig',savedConfig)
})

在我的secondWindow中，我在IpcElectronService中收到此消息：

this.ipc.on('savedConfig',(event,savedConfig: any) => {
  this.savedConfig$.next(savedConfig)
})

并且在login.compontent.ts中，我使用FormBuilder（fb）创建了表单，我利用了可观察对象来获取值并显示它们。

savedConfig$: Observable<login>
...
loginForm = this.fb.group({
user: ['',Validators.required],password: ['',ip: ['',save: false
})

...
getSavedConfig$() {
this.savedConfig$ = this.electron.getSavedConfig$()
this.savedConfig$.subscribe((savedConfig) => {
  this.loginForm.setValue(savedConfig)})
}

好吧，除了setValue（我正确地获取了值）之外，所有这些都可以正常工作。我的login.component.html是：

<div class="container">
<form novalidate [formGroup]=loginForm (ngSubmit)=onSubmit()>
    <div fxLayout="column" fxLayoutAlign="space-around center">
        <mat-form-field>
            <mat-label>User: </mat-label>
            <input matInput type="text" formControlName="user">
            <mat-error *ngIf="loginForm.controls.user.hasError('required')">You must enter an user</mat-error>
        </mat-form-field>
        <mat-form-field>
            <mat-label>Password: </mat-label>
            <input matInput type="password" formControlName="password">
            <mat-error *ngIf="loginForm.controls.password.hasError('required')">You must enter password</mat-error>
        </mat-form-field>
        <mat-form-field>
            <mat-label>IP: </mat-label>
            <input matInput type="text" formControlName="ip" placeholder="localhost:8080">
            <mat-error *ngIf="loginForm.controls.ip.hasError('required')">You must enter ip</mat-error>
        </mat-form-field>
    </div>
    <div fxLayout="row" fxLayoutGap="20px" fxLayoutAlign="space-around center">
        <div>
            <button type="submit" [disabled]="!loginForm.valid">Login</button>
            <button (click)="destroyMe()">Cancel</button>
        </div>
        <div>
            <mat-checkBox formControlName="save">Save</mat-checkBox>
        </div>
    </div>
</form>

但是，当我使用this.loginForm.setValue(savedConfig)时，我可以在登录表单中显示保存的值，但是以此方式

Login Form

知道我在做什么错吗？ 非常感谢！

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

angularangularelectronelectronformbuildersetvaluesetvaluetypescripttypescripttypescript