Call Lightning component using URL button

Question

I cannot call the lightning component from a quick action as we have feed tracking enabled and the button doesnt show in the top of the page. I am trying to see if we can call the lightning component through URL

The component has two attributes like record and complete

<aura:component implements="force:hasRecordId,force:lightningQuickActionWithoutHeader">
  <aura:attribute name="record" type="Case" default="{ 'sobjectType': 'Case' }" />
  <aura:attribute name="complete" type="Boolean" default="false" />
  <force:recordData recordId="{!v.recordId}"
                    fields="['CaseNumber','Status']"
                    targetFields="{!v.record}"
                    aura:id="recordData"
                    mode="EDIT"
                    recordUpdated="{!c.recordLoaded}" />
</aura:component>

Controller

({ 
  recordLoaded: function(component, event, helper) {
    var caseRecord = component.get("v.record"),
      recordData = component.find("recordData");

      caseRecord.Status = 'Closed';

      if(!component.get("v.complete")) { // Avoid infinite loop
      component.set("v.complete", true);
      component.set("v.record", caseRecord);
      var toastEvent = $A.get("e.force:showToast");
      recordData.saveRecord($A.getCallback(function(result) {
        if(result.state === "SUCCESS" || result.state === "DRAFT") {
            $A.get("e.force:closeQuickAction").fire();                   
            toastEvent.setParams({
                message: 'Case is Closed!',
                type: 'success',
                mode: 'pester'                
            });
            toastEvent.fire();                
        } else { 
                toastEvent.setParams({
                message: 'Case Cannot be Closed!',
                type: 'error',
                mode: 'pester'                
            });
            toastEvent.fire(); 
        }          
      }));
  }
  }})

I am not sure if we can pass the record as the parameter here through URL. Can anyone help me how I can call the lightning component through URL passing the parameter

Answer 1

First Add lightning:isUrlAddressable interface to the component to which you want to expose it as url and then use below for navigation in calling component

Add lightning:navigation aura:id="navService" in cmp file

({

handleClick: function(cmp, event, helper) {
        var navService = cmp.find("navService");

        var pageReference = {    
             "type": "standard__component",
             "attributes": {
                  "componentName": "c__MyLightningComponent"    
              },    
             "state": {
                "recordId": recordId
             }
       }
        event.preventDefault();
        navService.navigate(pageReference);
    }
})