How to use Split() function inside an Expression in lightning component

Question

I would like to use Split function inside my expression in salesforce lightning. I'm passing a map from my class and receiving the same in js controller and then converting it to List attribute for component utilization.

My map is getting retured as this sample,

Map<String,String>
myMap -> key = "textSplit0_textSplit1" , value = "someString"

In JS Controller, I'm converting the map as list like this,

var output = response.getReturnValue();
var someMap = [];
if(output){
    for( var key in output ){
        someMap.push({key:key, value:output[key]});
    }
component.set("v.allCustomLinksMap",someMap);
}

in my component, I have a List attribute and i want to iterate over my map for the above. I have code like this, and am facing a syntax error.

Here, {!cus.key} works fine but I would like to get myMap's Key splitted at '_' and returned as expected below.

<aura:attribute name="allCustomLinksMap" type="List"/>

<aura:iteration items="{!v.allCustomLinksMap}" var="cus" indexVar="key">

    <h3 class="slds-truncate" title="{!cus.key}">{!(cus.key.split('_'){0})}</h3>

    <div class="slds-tile__detail slds-text-body_small">
    <dl class="slds-list--horizontal slds-wrap">
        <a href="{!cus.value}">{!(cus.key.split('_'){1})}</a>
    </dl>                                   

</div>

</aura:iteration>

is there a way to achieve this ? TIA

Answer 1

The only methods you can use in expressions are found in the Expressions Function Reference, and for the most part, they appear more or less like how formula fields operate (in other words, the correct expression would look something like {!split(cus.key,'_')[1]}). However, split isn't a supported function. You would necessarily need to process that data in your controller.

---

    someMap.push({key:key, key0: key.split('_')[0], key1:key.split('_')[1], value:output[key]});

---

<h3 class="slds-truncate" title="{!cus.key}">{!cus.key0}</h3>

---

    <a href="{!cus.value}">{!cus.key1}</a>