2

I'm not able to pass a dynamic string array into a component without using java script.

Example: values="{!v.foo + ',bar'}". In this example, the (expected) array seems to be passed as a String. I would prefer to pass the values like {![v.foo, 'bar']} but it won't let me save.

unexpected token: a left square bracket at column 1

So is there a way to generate this array without using a controller? it would make my component much more readable.

my.app

<aura:application >
    <aura:attribute name="foo" type="String" default="foo" />

    <c:fooBar values="{!v.foo + ',bar'}" />
</aura:application>

fooBar.cmp

<aura:component >
    <aura:attribute name="values" type="String[]" />

    <aura:handler name="init" value="{!this}" action="{!c.init}" />
</aura:component>

Log typeof values

({
    init: function(cmp, event, helper) {
        console.log(typeof cmp.get("v.values"));
       // output: string
    }
})
3

Why you don't want to use Lightning Controller. I don't think you can handle it without JS, as compiler won't let you save it(this is also your current behaviour).

I suggest you create an array in JS and use that.

<aura:application >
    <aura:attribute name="foo" type="String" default="foo" />
    <aura:attribute name="values" type="String[]" default="[]"/>
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    <c:fooBar values="{!v.values}" />
</aura:application>

and JS

({
    doInit : function(cmp, event, helper) {
        var valueArr = [];
        valueArr.push('StaticValue');
        valueArr.push(cmp.get("v.DynamicValue"));
        cmp.set("v.values", valueArr);
       // output: string
    }
})
| improve this answer | |
  • 1
    thanks for your response, and taking tie to anwer it! I decided to do it the other way around to overcome redundant js whenever I call my component (see my answer). – Basti Jan 22 '19 at 12:13
  • @Basti glad to know you are able to solve it other way around. – Tushar Sharma Jan 22 '19 at 13:07
0

Have you tried declaring the type of foo attribute to String[] in the Lightning application? I mean like below.

<aura:application >
<aura:attribute name="foo" type="String[]" default="foo" />
<c:fooBar values="{!v.foo + ',bar'}" />

| improve this answer | |
  • This doesn't help and I don't see how it would. – Basti Jan 22 '19 at 11:41
0

Thanks for your feedback. It seems to be impossible to solve it without js, so I decided to fix this at a central point in my fooBar component.

So since I know, that my dynamic input will always result in a comma separated list, I decided to convert it after passing it in, what makes calling my components readable and js free. (This example is using a value provider to point out why it's cleaner this way)

<aura:application >
    <c:X context="{!this}" /> // value Provider

    <c:fooBar values="{!X.foo + ',' + X.bar + ',' + X.more}" />
    <c:fooBar values="{!X.foo + ',' + X.more}" />
</aura:application>

<aura:component >
    <aura:attribute name="values" type="String" />
    <aura:attribute name="casted" type="String[]" />

    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
</aura:component>


({
    doInit : function(cmp, event, helper) {
        cmp.set("v.casted", cmp.get("v.values").split(','));
        console.table(cmp.get("v.casted"));
    }
})
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.