After the upgrade to v6, model is undefined in expressionProperties

[sranjan-m]

Afte upgraded to v6, it's breaking a lot of things.

'model' is undefined in expressionProperties, hideExpression. Everything was fine before the upgrade.

[
  {
    "key": "ParentForm",
    "fieldGroup": [
        
    ]
  },
  {
    "key": "Child1",
    "hideExpression": "!model.ParentForm._id",
    "expressionProperties": {
      "model.Child1.ParentCode": "model.ParentForm._id"
    },
    "fieldGroup": [
        
    ]
  }
]

Can't do this anymore. Most of the times the 'model' is undefined and hence getting this kind of error.

[aitboudad]

Hi, I think its related to default value (https://formly.dev/docs/guide/migration#2-defaultvalue-for-fieldgroup-and-fieldarray-type).

Could you please check if the following solution can your issue:

FormlyModule.forRoot({
  types: [
    {
      name: 'formly-group',
      defaultOptions: {
        defaultValue: {}
      }
    }
  ],
})

[sranjan-m]

Even after setting the above in module imports, I'm still getting the same error. Everything was perfect before the upgrade, it was working perfectly fine.

[aitboudad]

Upgrading into a new major version imply some changes that may break some apps and that's totally normal, if you can provide a reproduction it may help us to provide some guidance on how to fix the issue on your side.

You may check if its related to the following bug: #3664
Also ensure you've checked our migration guide: https://formly.dev/docs/guide/migration

[sranjan-m]

It's really difficult to provide the exact replication of what we built in our project. We created many custom types and controls on top of ngx-formly. But I can explain how our model is and how our configuration looks like.

The configuration is something like below.

[
  {
    "key": "ParentForm",
    "fieldGroup": [
      {
        "key": "_id"
      },
      {
        "key": "Name",
        "type": "input",
        "templateOptions": {
          "label": "Name",
          "required": true
        }
      },
      {
        "key": "Remarks",
        "type": "textarea",
        "templateOptions": {
          "label": "Remarks",
          "rows": "2"
        }
      }
    ]
  },
  {
    "key": "ChildForm",
    "hideExpression": "!model.ParentForm._id",
    "expressionProperties": {
      "model.ChildForm.ParentId": "model.ParentForm._id"
    },
    "fieldGroup": [
      {
        "key": "_id"
      },
      {
        "key": "Description",
        "type": "textarea",
        "templateOptions": {
          "label": "Description",
          "rows": "2"
        }
      }
    ]
  }
]

And the model will be like this,

model = {
  ParentForm: {
    _id: "<alphanumeric unique id of the parent form>",
    Name: "My name",
    Remarks: ""
  },
  ChildForm: {
    _id: "<alphanumeric unique id of the child form>",
    ParentId : "<_id of Parent>",
    Description: ""
  }
}

But since the upgrade, the hideExpression and expressionProperties doesn't work anymore, and it shows the error as I mentioned earlier (undefined error).
Is there any workaround to resolve this?

[aitboudad]

Is there any workaround to resolve this?

The issue is related to the defaultValue which is set to undefined in v6, the only workaround is in the above comment #3667 (comment)

Anyway will provide a potential fix at the end of week and I hope it'll solve your issue as well.

[sranjan-m]

Already tried 3667 (comment)
Even after adding this in module imports, it's still not resolved.

Anyway, will wait for the update / fix.
Thanks!

[aitboudad]

This issue has been fixed and released as part of v6.1.5 release.

Please let us know, in case you are still encountering a similar issue/problem.
Thank you!