ngx-Formly-默认情况下显示第一个数组输入,而不初始化空模型

问题描述

我正在使用ngx-formly的JSON Schema方法构建自定义表单(Angular 9 + ng-bootstrap + bootstrap 4)。我们的应用程序有很多数组输入-有些甚至嵌套。我使用了https://formly.dev/examples/advanced/json-schema中的自定义数组类型代码来实现数组显示

基于数组输入模式的表单呈现-正确的意义是嵌套层次结构是必需的。但是,在数组输入的情况下-除非有人单击添加(加号)按钮以显示第一组输入,否则表单字段不会显示。从UI的角度来看,即使用户没有为数组输入任何值(这些不是强制性输入),我们也需要至少显示一组字段。

到目前为止,文档似乎有两种方法

  1. 使用数组的第一项为空或为空的方式初始化模型对象似乎是使字段显示方法。但是我们需要进行空/脏/未改动的检查,才能不将这些字段提交给后端。
  2. 我们更改了数组类型定义文件中的模板,以显示一组空字段。还没有尝试过这种方法,不确定如果强制显示一组字段,数组字段的绑定将如何工作。

还有另外一种方法可以实现这一点-通过使用一些选项字段?

解决方法

我似乎找到了解决方案:)

需要放"defaultValue": [ "undefined" ]。 完整代码如下。

 {
                        "fieldGroup": [
                            {
                                "key": "driver_section","type": "repeatDrivers","defaultValue": [ "undefined" ],"fieldArray": {
                                    "fieldGroup": [
                                        {
                                            "key": "last_name","type": "input","className": "flex-2","defaultValue": "","templateOptions": {
                                                "label": "Фамилия","required": true
                                            }
                                        },{
                                            "key": "first_name","templateOptions": {
                                                "label": "Имя",{
                                            "key": "paternal_name","templateOptions": {
                                                "label": "Отчество",{
                                            "key": "date_of_birth","templateOptions": {
                                                "type": "date","label": "Дата рождения",{
                                            "key": "series_and_number_of_VU","templateOptions": {
                                                "type": "number","label": "Серия и номер ВУ",{
                                            "key": "date_of_issue_of_the_current_VU","label": "Дата выдачи действующего ВУ",{
                                            "key": "year_of_issue_of_the_first_VU","label": "Год выдачи первого ВУ",{
                                            "key": "driver_license_changed","type": "checkbox","templateOptions": {
                                                "label": "Водительское удостверение менялось в течение года","required": false
                                            }
                                        }
                                    ],"fieldGroupClassName": "display-flex"
                                },"templateOptions": {
                                    "title": "Drivers",}
                            }
                        ],"fieldGroupClassName": "display-flex"
                    }   

相关问答

Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其...
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。...
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbc...