Hi,
I have a angular variable {{example.variable}} which is coming from angular controller.
{{example.variable}} has a value(4 digit code) - 1001
I wanted to do something like below(passing the angular variable from sightly to javascript file):
<div data-sly-use.data="${'example.js' @fieldName = '{{example.variable}}' }"/>
In example.js file:::::
var abc = this.fieldName; (reading the property from html file)
out.println(abc) //Result is 1001
out.println(abc.length) //Result is 17(Surprised. Was expecting 4)
I printed the abc character by character then and the result came as "{{example.variable}}" and not the value inside the angular variable(i.e 1001).
Please let me know if there is any way to pass the dynamic value of angular variable.
Thanks
Akshita
Solved! Go to Solution.
Views
Replies
Total Likes
Feike Visser wrote...
To me the {{errorcode}} is empty when it is being parsed server-side.
Hi Feike,
I got the solution for my issue. Thanks for the quick response :)
I was following wrong approach.
By Using below angular directive in component html itself, i can directly use the angular variable and compare it with sightly variable for desired results.
<data-sly-use.var = "example.js">
<div ng-if="errorcode==${var.value}"> //Requirement - Wanted to compare angular variable with sightly variable
Thanks
Akshita
Views
Replies
Total Likes
[Edited by kautuk]
HTML Template Language (formerly known as Sightly) is parsed only serverside, if you need pass something you need to do it via url-params.
Views
Replies
Total Likes
As mentioned by Feike (Godfather of HTML Template Language formerly as Sightly) that is the best way.
Please have a look at this similar forum post:- http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/adobe-experience-manage...
// In this post, Feike, shared working code as well.
JAVA:
import io.sightly.java.api.Record;
import com.adobe.cq.sightly.WCMUse;
public class UseTest extends WCMUse {
public Record params=null;
public String p;
@Override
public void activate() throws Exception {
params = get("params", Record.class);
p = (String) params.get("dateRange");
}
}
Sightly:
<div data-sly-use.newsList="newsList.js">
${newsList.dateRange}
<div data-sly-use.articles="${'yourpackage.UseTest' @ params=newsList}">
${articles.p}
</div>
</div>
I hope this will help.
Thanks and Regards
Kautuk Sahni
Views
Replies
Total Likes
kautuksahni wrote...
As mentioned by Feike (Godfather of HTML Template Language formerly as Sightly) that is the best way.
Please have a look at this similar forum post:- http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/adobe-experience-manage...
// In this post, Feike, shared working code as well.
JAVA:
import io.sightly.java.api.Record;
import com.adobe.cq.sightly.WCMUse;
public class UseTest extends WCMUse {
public Record params=null;
public String p;
@Override
public void activate() throws Exception {
params = get("params", Record.class);
p = (String) params.get("dateRange");
}
}
Sightly:
<div data-sly-use.newsList="newsList.js">
${newsList.dateRange}
<div data-sly-use.articles="${'yourpackage.UseTest' @ params=newsList}">
${articles.p}
</div>
</div>
I hope this will help.
Thanks and Regards
Kautuk Sahni
Thanks for the response Feike/Kautuk,
However, my question is little different :)
I have a angular variable {{errorcode}} with value as 1001
Above variable I was trying to pass in component js(Using Javascript API) through below line of code:
<div data-sly-use.articles="${'yourpackage.js' @ params=
{{errorcode}}}"> //Not working
errorcode is basically coming from angular code(controller.js) not from the dialog field. The above mentioned solution works fine if i am dealing with dialog values.
First - Is it possible to achieve this without java?
Second - Can't I directly pass angular variable in sightly component js??
Thanks,
Akshita
Views
Replies
Total Likes
To me the {{errorcode}} is empty when it is being parsed server-side.
Views
Replies
Total Likes
Feike Visser wrote...
To me the {{errorcode}} is empty when it is being parsed server-side.
Hi Feike,
I got the solution for my issue. Thanks for the quick response :)
I was following wrong approach.
By Using below angular directive in component html itself, i can directly use the angular variable and compare it with sightly variable for desired results.
<data-sly-use.var = "example.js">
<div ng-if="errorcode==${var.value}"> //Requirement - Wanted to compare angular variable with sightly variable
Thanks
Akshita
Views
Replies
Total Likes