How to navigate from one lightning component to another lightning component?

I have tried several ways to do this and have not reached enlightenment.

I have the same problem as outlined in this question Navigation between components in lightning

I was optimistic about using navigateToUrl but only .app have available urls, and .app cannot be seen in the salesforce1 mobile application. The components are not available via a direct url.

Here is what I have found:


This works in an app but not in mobile:

$A.get("e.myNamespace:navigateToView").setParams({"view": "bar"}).fire();


For this I cannot figure out what my recordId is for my lighning component. BTW, Also tried “componentId”: “xxx” which I found in Dave Carroll’s sublime manifest file:
$A.get("e.myNamespace:navigateToSObject").setParams({"recordId":"XXXXX2"}).fire();


The following also does not work:

$A.get("e.myNamespace:navigateToObjectHome").setParams({"scope":"myNamespace__expenseTracker__c"}).fire();


This works great and will take me to the homepage. I wish it worked for lightning components:

$A.get("e.force:navigateToURL").setParams({"url":"/_ui/core/chatter/ui/ChatterPage"}).fire();


Anybody familiar with a full lightning component example that demonstrations a navigation technique that works in salesforce mobile?

Answer

Seems there is an event missing from the documentation, I went through this last week. Try this..

Component markup

<ui:button label="ATTENDANCE" press="{!c.navigateToRollCall}"/>

Controller (I am using default namespace here for my component AttendanceRollCall)

navigateToRollCall : function(component, event, helper) {
    var evt = $A.get("e.force:navigateToComponent");
        evt.setParams({
            componentDef: "c:AttendanceRollCall",
            componentAttributes: {
                programId: component.get("v.program.Id")
            }
        });
    evt.fire();    
}

Attribution
Source : Link , Question Author : waveforms , Answer Author : Troy

Leave a Comment