I am building a component using a lightning-record-edit-form, which may either display an existing record for edit, or a new record for create. The component will set the record-id appropriately. One of the fields I need to display is a Lookup field, and it should not be user-editable. When the edit form is displaying an existing record, this field is guaranteed to be pre-populated, so a lightning-output-field would work. When displaying a new record for create, the containing LWC will know the correct record id for the lookup (and should set it prior to save); I need to pre-populate the value and display the field, but I can't figure out how to pass the value so that the lightning-output-field can display it.
The only way I know to pre-populate a value in a lightning-record-edit-form is to use the value attribute of a lightning-input-field component. However, if I do that, the user can change the value, which should not be allowed. I would normally use the read-only attribute, but per the lightning-input-field docs (and confirmed empirically), that does not work for lookup fields – it remains editable.
I tried adding both a hidden lightning-input-field with value attribute to allow me to set the value, and a lightning-output-field to show the value, but that doesn't work – the output field remains blank.
I am aware that I could intercept the submit event and set the lookup id in the fields object before calling this.template.querySelector('lightning-record-edit-form').submit(fields), but displaying the lookup on the form is a requirement.
I considered just displaying the value myself, but assuming that I only have the record Id, I would need to separately query for the related field's display value, and attempt to format to match the rest of the form. I'm saving this as a last resort; I'm hoping there's some way to tell the record-edit-form to populate the lookup field with my id value, and allow an OOB component to display the corresponding record name for that value.
Best Answer
I did something similar some time ago, but with the aura version of the component (take a look here)... you can implement the same idea easily in LWC, although with this approach you'll have to retrieve the related record to get the Name (you could use @wire and getRecord LDS wire adapter for that).
Edit: thinking about it I remembered a more recent implementation of the view you could take, this one, look at how I display ownerNameValue. Hope that helps.