List Form Formatting treats lookup columns as flat value

Target SharePoint environment

SharePoint Online

What SharePoint development model, framework, SDK or API is this about?

Declarative list formatting

Developer environment

No response

What browser(s) / client(s) have you tested

• 💥 Internet Explorer
• 💥 FireFox
• 💥 Microsoft Edge
• 💥 Safari
• 💥 Google Chrome
• mobile (iOS/iPadOS)
• mobile (Android)
• not applicable
• other (enter in the "Additional environment details" area below)

Additional environment details

No response

Describe the bug / error

When referencing a lookup column in List Formatting you have access to the value and the lookup list item id. In standard formatting you reference these using the following syntax:

[$MyLookup.lookupValue] - provides you the value (i.e. Dog)
[$MyLookup.lookupId] - provides you the list item ID from the target list (i.e. 4)

Using those same expressions from above when using form formatting will cause your header or footer not to render when your lookup has a value. Instead, you have to reference the field like so:

[$MyLookup] - provides you a flat value (i.e. 4;#Dog)

This is both inconsistent (so a bug) and terrible as it requires people to parse the values themselves using further expressions.

Until this is fixed, here is how you can reference the parts:

=Number(substring([$MyLookup],0,indexOf([$MyLookup],';#'))) - Returns the ID as a number
=substring([$MyLookup],indexOf([$MyLookup],';#')+2,1000) - Returns the value as text

This issue is present in both the formatting for form header/footer and in expressions used for conditional field display.

Steps to reproduce

1. Create a list with a lookup
2. Reference that lookup on your form with this basic format in the header:

{
  "elmType": "div",
  "txtContent": "[$MyLookup]"
}

3. See the value in the flat format described above
4. Wipe away your tears and use the work around expressions from above

Expected behavior

Lookup values should be accessible just as they are in all other forms of List Formatting by using the .lookupValue and .lookupId sub props.