表单数组循环验证

Question

我有使用表格数组的送货地址列表但最初我必须显示每个送货地址，当用户点击特定的送货地址显示弹出然后填写每个字段如果提交无效我必须在特定的送货地址上显示错误符号。在这里，我不知道如何将每个送货地址推送到弹出窗口。你可以在这里看到完整的工作实例

https://stackblitz.com/edit/angular-r4jruv?file=app%2Fapp.component.html

我曾尝试使用此类点击事件发送每个表单，但我不知道如何处理和显示为表单

<form [formGroup]="myForm">

        <div formArrayName="addresses" >
            <div *ngFor="let address of myForm.controls.addresses.controls; let i=index" class="panel panel-default">

                <div [formGroupName]="i" class="myform">
         <span (click)="test(address)"> Delivery address {{i+1}}</span>
                </div><br><br>
            </div>
        </div>
    </form>

但我想做这样的事情：

如果您在此图片中看到我拥有用户可以从下拉列表中选择的所有送达地址列表，只要用户点击特定地址，它必须显示表单然后验证它是否有效我必须删除错误符号否则我必须保留符号

这很难实现。请帮我解决。

Answer 1

尝试向isValid模型添加属性myForm.controls.addresses.controls，然后您可以为每个地址元素更改属性。显然，您必须进行验证才能显示或隐藏验证文本或错误图标。