FORMIO - Коллективное заполнение формы значениями по умолчанию (НЕ ДОКУМЕНТОВАН? Или НЕ ПОДДЕРЖИВАЕТСЯ?)

Question

Среда

• Тип хостинга

  • [] Form.io
  • [x] Локальное развертывание

• Formio. js версия: - Версия: 4.9.26

• Frontend framework: Angular 8 +

• Браузер: Chrome

• Версия браузера: Версия 83.0.4103.116 (Официальная сборка) (64-разрядная)

Ожидаемое поведение

для поддержки групповой (коллективной) настройки defaultValue для значений формы. как для отдельного компонента формы defaultValue настройка`

Наблюдаемое поведение

neither `this.tempFormContent.defaultValue =  formSavedData`

ни this.tempFormContent.defaultValues = formSavedData работает

Это не задокументировано или нет поддерживается?

Пример

<mat-formio [form]="projectFormContent" (submit)="onSubmit($event)"></mat-formio>

Индивидуальная настройка на значение по умолчанию РАБОТАЕТ ОТЛИЧНО:

protected tempFormContent:any = {
    "components": [
      {
        "label": "How do YOU define 1",
        "spellcheck": true,
        "tableView": true,
        "validate": {
            "unique": false,
            "multiple": false
        },
        "key": "key1",
        "type": "textarea",
        "input": true,
        "defaultValue": defValuekey1Saved,
        description: "...."
      },
      {
        "label": "How do YOU define 2",
        "spellcheck": true,
        "tableView": true,
        "validate": {
            "unique": false,
            "multiple": false
        },
        "key": "key2",
        "type": "textarea",
        "input": true,
        "defaultValue": defValuekey2Saved,
        description: "...."
      },
      {
        "type": "button",
        "label": "Save and Next",
        "key": "submit",
        "disableOnInvalid": true,
        "input": true,
        "tableView": false,
        "validate": {
            "unique": false,
            "multiple": false
        }
      }
    ]
  };

//returning the value used in the HTML template
public get projectFormContent():any {
    return this.tempFormContent;

НО есть ли какие-то групповые настройки по умолчанию, я пробовал это, но НЕ работает:

protected tempFormContent:any = {
    "components": [
      {
        "label": "How do YOU define 1",
        "spellcheck": true,
        "tableView": true,
        "validate": {
            "unique": false,
            "multiple": false
        },
        "key": "key1",
        "type": "textarea",
        "input": true,
        // "defaultValue": defValuekey1Saved,
        description: "...."
      },
      {
        "label": "How do YOU define 2",
        "spellcheck": true,
        "tableView": true,
        "validate": {
            "unique": false,
            "multiple": false
        },
        "key": "key2",
        "type": "textarea",
        "input": true,
        // "defaultValue": defValuekey2Saved,
        description: "...."
      },
      {
        "type": "button",
        "label": "Save and Next",
        "key": "submit",
        "disableOnInvalid": true,
        "input": true,
        "tableView": false,
        "validate": {
            "unique": false,
            "multiple": false
        }
      }
    ]
  };

//returning the value used in the HTML template
public get projectFormContent():any {
    this.tempFormContent.defaultValue =  {'defValuekey1':defValuekey1Saved, 'defValuekey2':defValuekey2Saved};
   // this neither works:
   // this.tempFormContent.defaultValues =  {'defValuekey1':defValuekey1Saved, 'defValuekey2':defValuekey2Saved};
    return this.tempFormContent;

Answer 1

Итак, я пришел к решению, пока группа населения не будет изначально поддерживаться в Formio:

<mat-formio [form]="formContent" (submit)="onSubmit($event)"></mat-formio>

и код:

protected _formContent:any = {
    "components": [
      {
        "label": "How do YOU define 1",
        "spellcheck": true,
        "tableView": true,
        "validate": {
            "unique": false,
            "multiple": false
        },
        "key": "key1",
        "type": "textarea",
        "input": true,
        // "defaultValue": defValuekey1Saved,
        description: "...."
      },
      {
        "label": "How do YOU define 2",
        "spellcheck": true,
        "tableView": true,
        "validate": {
            "unique": false,
            "multiple": false
        },
        "key": "key2",
        "type": "textarea",
        "input": true,
        // "defaultValue": defValuekey2Saved,
        description: "...."
      },
      {
        "type": "button",
        "label": "Save and Next",
        "key": "submit",
        "disableOnInvalid": true,
        "input": true,
        "tableView": false,
        "validate": {
            "unique": false,
            "multiple": false
        }
      }
    ]
  };

  public get formContent():any {
    if(this.mLShareService.projectInfo.get(PHASE_NAME)){ // populating form with its previously saved values:
      const savedForm:any = this.mLShareService.projectInfo.get(PHASE_NAME); //gets the previously saved form from the external service
      for (let index = 0; index < this._formContent.components.length; index++) {
        const component:any = this._formContent.components[index];
        const componentKey:string = component['key'];
        const componentType:string = (component['type'] as string).toLocaleLowerCase();

        if( //avoids non-dynamic (non-filled) elements
          componentType === 'button' || // a button
          componentType === 'content')  // plain text and not an input field
        { continue;}
        if(savedForm[componentKey]){
          component.defaultValue = savedForm[componentKey];
        }
      }
    }

    return this._formContent;
  }

При необходимости Глубокая популяция (если форма содержит панелей ) может быть предоставлена ​​путем проверки типа (например, type: "panel") и рекурсивного вызова метода.