3

LWC - HTML - PARENT

        <div class="slds-page-header__col-details">
            <ul class="slds-page-header__detail-row">
                <template if:true={hKeyFields}>
                    <template for:each={hKeyFields} for:item="field">
                        <li class="slds-page-header__detail-block" key={field.apiName}>
                            <div class="slds-text-title slds-truncate" title={field.label}>
                                <span>{field.label}</span>
                                <template if:true={field.object.inlineHelpText}>
                                    <lightning-helptext content={field.object.inlineHelpText}></lightning-helptext>
                                </template>
                            </div>
                            <template if:false={field.object.reference}>
                                <div class="slds-truncate" title={field.record.displayValue}>{field.record.displayValue}</div>
                            </template>
                            <template if:true={field.object.reference}>
                                <c-relationship-link target-object-api={field.reference.value.apiName} target-label={field.reference.displayValue} target-id={field.reference.value.id} ></c-hl-relationship-link>
                            </template>
                        </li>
                    </template>
                </template>
            </ul>
        </div>

LWC - HTML - CHILD

<template>
    <a href={url} onclick={viewRecord} title={targetLabel}>{targetLabel}</a>
</template>

LWC - JS - CHILD

import { LightningElement, api, track} from 'lwc'; 
import { NavigationMixin } from 'lightning/navigation';
export default class RelationshipLink extends NavigationMixin(LightningElement) {
    @api targetId;
    @api targetLabel;
    @api targetObjectApi;
    @track url;
    connectedCallback() {
        //LL20190513 - Generate URL for viewing record page
        this.relationshipRef = {
            type: 'standard__recordPage',
            attributes: {
                recordId: this.targetId,
                objectApiName: this.targetObjectApi,
                actionName: 'view'
            }
        };
        this[NavigationMixin.GenerateUrl](this.relationshipRef)
            .then((url) => {
                this.url = url;
            });
    }
    viewRecord(evt){
        evt.preventDefault();
        evt.stopPropagation();
        this[NavigationMixin.Navigate](this.relationshipRef);
    }
}

Following solutions mentioned below and no luck:

Lightning Web Component - Navigation - Show Link in a List / Table to Open Record solution posted by @glls

Also note the Chrome console shows this:

aura_proddebug.js:237 [LWC warning]: Invalid event type "WireContextEvent" dispatched in element . Event name should only contain lowercase alphanumeric characters.

Output HTML

enter image description here

Chrome Debug Isolated

enter image description here

  • The resulting links don't work. Showing an image of the output html above. – Larry Leonidas May 13 at 21:19
  • Apologies @glls, if you see above updated my post to show the resulting html. Clicking on the link does not resolve to a valid hyperlink, just what you see in the screenshot of the output HTML, which does not navigate to the expected related record. – Larry Leonidas May 13 at 21:26
  • Yes the GenerateUrl promise seems to be the issue, but can't be certain. Not familiar enough with the NavigationMixin behavior. Screenshot above. – Larry Leonidas May 13 at 21:31
  • check the targetId and targetObjectApi – glls May 13 at 21:32
  • Outputted them on the page in parallel to the <a> tag and they both attributes show correct values. Debugged in console and they seem to be assigned properly to pageref attributes. – Larry Leonidas May 13 at 21:34
0

The issue here seems to be that NavigationMixin didn't support 15-Id, only 18-Id.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.