I'm opening a lightning component from another. It opens in a new tab inthe same workspace, as expected. But the tab name of this new component shows "Loading…" with the loading icon.
I've tried getting the active tab id and setting its label by the following code. But with this, the parent tab label changes, and NOT the one in which my 2nd lightning component is open.
var workspaceAPI = component.find("workspace");
console.log("workspaceAPI: " + workspaceAPI);
workspaceAPI.getFocusedTabInfo().then(function(response) {
var focusedTabId = response.tabId;
workspaceAPI.setTabLabel({
tabId: focusedTabId,
label: "My Label"
});
})
.catch(function(error) {
console.log(error);
});
How can I change the tab name to something else?
Best Answer
Given the clarification in comments I'm providing an alternative answer that uses
lightning:isUrlAddressable
andlightning:navigation
sinceforce:navigateToComponent
is deprecated.Your target component should implement the
lightning:isUrlAddressable
interface. This allows you to navigate to it through a URL and will give you access to the underlyingpageReference
so you can access parameters.This will ensure that your calling component has control over how the new component opens and will give you access to the Id for the created tab so you can set the label appropriately.
cmp_target
This is the target component that you can navigate to from another component. On init, the controller accesses
v.pageReference
which is provided by thelightning:isUrlAddressable
interface. It reads a url parameter from the pageReference and sets it as the value of a component attribute.cmp_target.cmp
cmp_targetController.js
cmp_source
This is an example of how to navigate to the target component from within another component. It uses the
workspaceAPI
to handle console navigation and navigates on a button click.cmp_source.cmp
cmp_targetController.js