5

I have the following markup in a Component

<aura:component controller="elfL1" implements="forceCommunity:availableForAllPageTypes,force:appHostable">
    <aura:handler name="init" value="{!this}" action="{!c.init}"/>
    <aura:attribute name="ts"       type="String"  />

    <ltng:require 
        styles ="{!'/resource/' + v.ts + '/elfLightningFixes_css'}" 
    />
    {!'/resource/' + v.ts + '/elfLightningFixes_css'}

And in the controller I'm populating ts

    init : function(component, event, helper) {
        console.log('elfL1.init()');
        component.set("v.ts",''+Math.round((new Date()).getTime())+'');
    },

Now the simple expression output {!'/resource/' + v.ts + '/elfLightningFixes_css'} works as expected as you see in the screenshot, but for <ltng:require/> it seems handled as array of the single letters of the string

enter image description here

Any idea on how to use the expression in <ltng:require/> ?


UPDATE:

Even using only a string attribute, it fails

<aura:attribute name="requireStyles"    type="String"  />
<ltng:require 
    styles = "{!v.requireStyles}" 
/>

setting the string in the clientside controller

var ts = '' + Math.round((new Date()).getTime());
component.set("v.requireStyles", '/resource/' + ts + '/elfLightningFixes_css' );

Error is very strange

Error during init : styles is undefined

enter image description here

2 Answers 2

1

Sorry folks this one fell through the cracks. If you do not get an answer in a timely fashion in the future please make sure to open a support case with Salesforce.

There are a few contributing factors:

  • the data type of scripts and styles are both String[] and Aura's auto coercion from comma separated list (String) to String[] does not kick in when you explicitly set the value of an attribute (it can't really because that could be a mistake of say the String[] represented paragraphs in a story)

  • Setting the value to a String[] in init() happens too late for ltng:require to "see" it and currently there is no logic in ltng:require to observe changes to scripts or styles attributes

ideally be of these will be addressed in a future version of ltng:require (this is where a support case would have also come in handy BTW).

For now the workaround I have used in my projects has been to use $A.createComponent("ltng:require",...) in my init() and then add the instance to the body of my component that needs the require. This turns things into late binding/creation and works great. You can see this in action here https://github.com/forcedotcom/aura-ng/blob/master/metadata/aura/region/regionController.js

Please open that support case to help me get this prioritized and in the product plan!

2
  • Thanks Doug for your reply. I try to open cases in parallel but without my client having Premier Plus, cases will get closed unattended. In this case my client had PP support, but the case has eaten up a lot until we got something. It's case 12677468 opened 2015-10-23, played ping-pong until I got on 2015-10-31 this: I have got a response from the T3 team and am informed that ltng:require's styles and scripts attributes expect a String[] variable. Aura at present does not coerce a String variable into a String[] variable, but this is expected to change in Spring16
    – Uwe Heim
    Jan 14, 2016 at 16:21
  • ...continued... : For now suggestion is to declare the attribute as String[]: <aura:attribute name="requireStyles" type="String[]" /> <ltng:require styles = "{!v.requireStyles}" /> ---- however I was not able to test it then. Is this the same workaround you suggested or something different? Is Spring16 changing anything? IMO ltng:require should simply use a timestamp technique like in VF does and we would have no need to worry about cached (obsolte) scripts
    – Uwe Heim
    Jan 14, 2016 at 16:24
0


did you get any feedback on this ? I think we are having a similar problem with ltng:require.
In our case we need to include a javascript resource, the url should be entered in the component attribute form when including the resource, so we are referencing it with {!v.parameterURL}.
We tried different approaches but none of the seemed to work:
a) using a string[] attribute and placing our string public parameter as a default,
we found that placing it either manually in the component controller

init : function(component, event, helper) {

var testUrls = [];
var testUrl = component.get("v.testUrl");
testUrls.push(testUrl);
component.set("v.testUrls", testUrls);
}

or explicitly

  <aura:attribute name="jQ" type="String" />
  <aura:attribute name="retrieveSet" type="String[]" access="private" default="{!v.jQ}" />

didn't work.

We also test creating a new component to wrap the ltng:require tag and receive the script url as a parameter and got same results, it didn't include the file.

We are not sure how to use expressions within this tag.

1
  • this is not an answer. They will delete this, soon.... But however, to answer your question: I got no feedback, still waiting, things are moving slowly...
    – Uwe Heim
    Oct 26, 2015 at 14:09

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .