Question

我在用选择多个控件初始化fromgroup时遇到问题。初始化运行正常，但是将from标记为无效。

Selissues  11
Genissues 68
Noissues  7
Otherissues  13
Total  99999
Pruning/OtherEfficiency .58064516129032258064
CSEfficiency .38888888888888888888

现在，当用户在多项选择中选择一个或多个任务时，表单组将变为有效。

{{controlPanelForm.value | json}} -> tasks: ["3","1","5"]
{{controlPanelForm.status | json}} -> "INVALID"

我需要formGroup从初始化开始有效。提前致谢。 //// html

{{controlPanelForm.value | json}} -> tasks: ["3","1","5"]
{{controlPanelForm.status | json}} -> "VALID"

////// ts

<form [formGroup]="controlPanelForm" (ngSubmit)="submit()">
    <select multiple id="tasks" size="7" [formControl]="controlPanelForm.get('tasks')">
        <option *ngFor="let t of projectTasks" [ngValue]="t.id">{{t.title}}</option>
    </select>
</form>
<div>
    {{controlPanelForm.value | json}}
</div>
<div>
    {{controlPanelForm.status | json}}
</div>

Answer 1

您的表单由

定义

'tasks': [[this.projectTasksIds], ...

这意味着一旦被请求，您的价值就会变成

form.tasks = [[1, 2, 3]]

但这不是问题所在（尽管您应该更正它）。问题是您有此数据

projectTasks: ProjectTask[] =[
    {id:'3', title:'title3'},
    {id:'1', title:'title1'},
    {id:'5', title:'title5'},
]

然后您对此进行迭代

this.projectTasks.tasks.map(...)

它不存在！这意味着您的数组为空，因此您的值为空。

Answer 2

问题出在同步！任务的值：[“ 3”，“ 1”，“ 5”]来自ajax。因此，当窗体初始化时，值是：[]。为了解决问题，我在ajax响应上使用了controlPanelForm.patchValues（...）方法。希望对其他有相同问题的人有所帮助。

Angular 7 FormBuilder的多选初始化值无效

2 个答案: