将JSP scriptlet转换成Adobe Slightly？

我在JSP adobe Cq5中使用了以下scriptlet，现在正在稍微迁移到Adobe。有下面的代码，这将在点击锚链接打开一个新窗口，相同的功能必须把它写在slightly..can你请帮我在这里将JSP scriptlet转换成Adobe Slightly？

------------------ if(!properties.get("buttonlabel","").equals("")){ 
     String targetUrl ="#"; 
     targetUrl = properties.get("buttonurl","#"); 
       if(targetUrl.startsWith("/content")){ 
        targetUrl = targetUrl+".html"; 
       } 
    String target = "_self"; 

    if(currentNode.hasProperty("openWindow")){ 
       target = "_blank"; 
      } 



%> 
<!-- 
<div class="fcdetails-button-holder"> 
         <a href='<%=targetUrl%>' target ='<%=target%>' name='<%=properties.get("buttonlabel","Title")%> button' id="wp-ctoa_button" class="button" role="button"><%=properties.get("buttonlabel","Title")%></a> 
        </div> 
--> 

    <div class="fcdetails-button-holder"> 
    <button type="button" id="wp-ctoa_button" class="button" onclick="redirect()"><%=properties.get("buttonlabel","Title")%></button> 
    </div> 
    <script type="text/javascript"> 
     function redirect() 
     { 
      var url = "<%=targetUrl%>"; 
      window.open(url,"<%=target%>"); 
     } 
    </script>

来源

2016-03-07 TP_JAVA

有并排this小抄侧，将使转换变得容易很多。

来源

2016-03-08 04:43:46 SubSul

关于视觉上的很酷的事情是关注于改善组件的“模板性” - 以及将逻辑关注点与表示分离。但是，JSP也可以完成所有这些 - 只是AEM中的示例显示了如何对所有代码进行编码的最差示例。

返工的JSP示例：

<c:if test="${not empty properties.buttonLabel}"> 
    <div class="fcdetails-button-holder"> 
    <button type="button" id="wp-ctoa_button" onclick="redirect()"> 
     ${empty properties.buttonLabel ? 'Title' : properties.buttonLabel} 
    </button> 
    </div> 
    <script type="text/javascript"> 
    function redirect() { 
     var url = '${properties.buttonUrl}' || '#'; 
     if (url.match(/^\/content\//) url += '.html'; 
     window.open(url, "${empty properties.openWindow ? '_self' : '_blank'}"); 
    } 
    </script> 
</c:if>

现在JSP看起来并不比悦目例子复杂得多。

来源

2016-03-08 16:43:06

将逻辑移入Java或服务器端JavaScript中，以使Sightly模板保持清洁和无逻辑。在这里，我们使用data-sly-use块将模板与Java bean绑定，并将其保存到button对象中，以便在整个模板中重用。您唯一需要处理的其他事情是脚本标记中的上下文，以便确定适用的XSS保护类型。

<sly data-sly-use.button="com.company.project.components.Button" data-sly-test="${button.label}"> 
    <div class="fcdetails-button-holder"> 
     <button type="button" id="wp-ctoa_button" class="button" onclick="redirect()" data-sly-text="${button.label}"></button> 
    </div> 
    <script type="text/javascript"> 
     function redirect() 
     { 
      var url = "${button.targetUrl @ context='scriptString'}"; 
      window.open(url, "${button.target @ context='scriptString'}"); 
     } 
    </script> 
</sly>

下面是扩展WCMUsePojo类的Java bean示例。您还可以查看Sling模型。

public class Button extends WCMUsePojo { 

    private String label; 
    private String target; 
    private String targetUrl; 

    @Override 
    public void activate() throws Exception { 
     ValueMap properties = getProperties(); 

     label = properties.get("buttonlabel", String.class); 
     target = properties.get("openWindow", false) ? "_blank" : "_self"; 
     targetUrl = properties.get("buttonurl", "#"); 

     if (targetUrl.startsWith("/content")) { 
      targetUrl += ".html"; 
     } 
    } 

    public String getLabel() { 
     return label; 
    } 

    public String getTargetUrl() { 
     return targetUrl; 
    } 

    public String getTarget() { 
     return target; 
    } 
}

来源

2016-03-11 16:13:58 nateyolles

将JSP scriptlet转换成Adobe Slightly？

回答

相关问题