Using lightning:workspaceAPI we can change Tab Label dynamically. Basically this component allows to access methods for programmatically controlling workspace tabs and subtabs in a Lightning console app. Here is an example to change Account record Tab Label “Account Name” to “Account Type” with “Account Name”.
Lightning Component:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | < aura:component implements = "flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access = "global" > <!--Attributes--> < aura:attribute name = "accFields" type = "Account" /> <!--Component Start--> <!--Lightning Workspace API--> < lightning:workspaceAPI aura:id = "workspace" /> <!--Lightning Force Data to get Account record--> < force:recordData aura:id = "accRecordData" layoutType = "FULL" recordId = "{!v.recordId}" targetFields = "{!v.accFields}" recordUpdated = "{!c.handleRecordUpdate}" /> <!--Component End--> </ aura:component > |
Lightning JS Controller:
1 2 3 4 5 6 7 8 9 10 11 12 13 | ({ handleRecordUpdate: function (component, event, helper) { var accountFields = component.get( "v.accFields" ); var workspaceAPI = component.find( "workspace" ); workspaceAPI.getFocusedTabInfo().then( function (response) { var focusedTabId = response.tabId; workspaceAPI.setTabLabel({ tabId: focusedTabId, label: accountFields.Type + ' - ' + accountFields.Name }); }) } }) |
Add above created lightning component on Account Lightning Record Page.