我正在Adobe Experience Manager中创建一个项目,并且在实现语言切换组件时遇到了问题。该组件应该允许用户单击链接并更改页面的语言。例如,如果他们在英语页面上/content/myproject/en/home.html
并单击它,则应该以结束/content/myproject/fr_ca/home.html
。
作为启动和运行的一部分,我试图进行连接currentPage.path
,"/profile.html"
以便至少可以使该组件在标记中注册对字符串的某些更改。
在英语的home.html页面中,currentPage.path
生成字符串"/content/myproject/en/home"
。如果我使用Sightly进行类似操作,则将其与/profile.html
应该会产生字符串。"/content/myproject/en/home/profile.html"
<p>${langinfo.goToPage}</p>
但是,如果我尝试这样做:<a href="${langinfo.goToPage}"></a>
组件将显示一个空白的定位标记。它还会清空我在两个锚标记之间编写的所有内容。
到目前为止,我已经尝试过返回一个用手写方式写出的字符串"/content/myproject/en/home/profile.html"
作为goToPage值,它可以在anchor标记中使用。另外,如果我只返回currentPage.path
它的作品。<a href="It doesn't work here!">
如果我尝试进行串联,则它拒绝像这样工作,但它将像这样工作:<a>It works here!</a>
。
在这一点上,我能想到的最好的一点是currentPage.path是JavaScript正在访问的Java String对象,并且当JS尝试使用来将其键入JavaScript字符串时会出现问题+
。如果我尝试使用String(goToPage)或goToPage.toString()将语句强制转换为字符串,它也将不起作用。我将其强制转换为字符串似乎并不重要。我看过的一个博客似乎暗示着Rhino的问题,在初始连接后我应该做一个.toString()。那没用。关于stackOverflow的另一篇文章似乎指出,尝试在JavaScript中连接Java String对象可能是一个问题,并指出应予以考虑,但不涉及如何处理该问题。
我追加到字符串不是组件的预期最终功能,但是如果无法通过串联修改字符串,似乎很难进行搜索和替换以将其更改/en/
为/fr-ca/
。如果有人对我的问题有比我正在尝试的解决方案更优雅的解决方案,那么对我正在解决的问题的修复将不胜感激。
我已将我的代码粘贴到此处(如建议的那样),并张贴了我的代码的屏幕快照以提供帮助。
Javascript:
use(function() {
var pageLang = currentPage.properties.get("jcr:language", "en");
var otherLangText;
var currPage = currentPage.name;
var currPagePath = currentPage.path;
var goPage;
if (pageLang == "fr_ca") {
otherLangText = "English";
goPage = "/content/myproject/en/index/home.html";
} else {
otherLangText = "Français";
goPage = "/content/myproject/fr-ca/home/home.html";
};
return {
otherLanguage: otherLangText,
goToPage: goPage
}
})
HTML:
<nav data-sly-use.langinfo="langcontact.js">
<ul class="lang-list-container">
<li class="lang-list-item"><a href="${langinfo.goToPage @ extension = 'html'}">${langinfo.otherLanguage}</a></li>
<li class="lang-list-item"><a href="/content/myproject/en/index/contact-us.html">Contact</a></li>
</ul>
</nav>
我在这里很困惑。我究竟做错了什么?
线 <li class="lang-list-item"><a href="${langinfo.goToPage @ extension = 'html'}">${langinfo.otherLanguage}</a></li>
实际上应该是-
<li class="lang-list-item"><a href="${langinfo.goToPage}">${langinfo.otherLanguage}</a></li>
您试图做的是将一个对象传递给该对象,该对象将不起作用,如果您要传递要在JS中使用的扩展名,则需要在USE调用中执行此操作。请参阅此博客中的示例。
更新 -
只要链接有效,您的代码对我来说就可以正常工作。
use(function() {
var pageLang = currentPage.properties.get("jcr:language", "en");
var otherLangText;
var currPage = currentPage.name;
var currPagePath = currentPage.path;
var goPage;
if (pageLang == "fr_ca") {
otherLangText = "English";
goPage = currPagePath+"/profile.html";
} else {
otherLangText = "Français";
goPage = currPagePath+"/profile.html";
};
return {
otherLanguage: otherLangText,
goToPage: goPage
}
})
您获取空href的唯一可能原因是链接无效,因此linkchecker会将其删除。如果您检查作者实例,您将在链接文本中看到断开的链接符号。
理想情况下,您应该修正逻辑,以便生成正确的有效链接。在开发中,您可以禁用linkchecker和/或link转换器以使所有链接正常工作(即使无效|不推荐)。可以http://localhost:4502/system/console/configMgr
通过搜索-Day CQ Link Checker Service
和来签入这两项服务Day CQ Link Checker Transformer
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句