組件迭代和JSF

呈現一個嵌套的樹狀對象結構下面給出的類定義：組件迭代和JSF

public class Comment { 

    String username; 
    String comment; 
    List<Comment> replies; 

    // ... 
}

是否有可能使用構建這使得在樹上包含在Comment實例數據JSF頁面如下結構？

Comments 
UserOne said 
blah blah 
---- 
    UserThree replied 
    blah blah blah 
    ---- 
    UserThree replied 
    blah blah blah 
---- 
UserTwo said 
blah blah 
---- 
UserOne said 
blah blah

來源

2012-06-06 auser

如果嵌套只有一個級別深，或具有最大深度的一個固定的量，那麼你可以只窩JSF中繼器部件一樣在對方<ui:repeat>或<h:dataTable>通常的方式。

<ul> 
    <ui:repeat value="#{bean.comments}" var="comment"> 
     <li>#{comment.username} #{comment.comment} 
      <ul> 
       <ui:repeat value="#{comment.replies}" var="reply"> 
        <li>#{reply.username} #{reply.comment}</li> 
       </ui:repeat> 
      </ul> 
     </li> 
    </ui:repeat> 
</ul>

但是，如果嵌套層次是「無限的」，那麼你需要一個JSF組件，而不是它可以呈現樹狀分層結構。這在標準的JSF組件集中不可用。您需要查看第三方組件庫，例如PrimeFaces <p:tree>或RichFaces <rich:tree>或OmniFaces <o:tree>。 OmniFaces可以讓你完全控制樹形標記，而對於其他人來說，你可能需要擺弄一些好的CSS來讓它看起來像你想要的。

<o:tree value="#{bean.comments}" var="comment"> 
    <o:treeNode> 
     <ul> 
      <o:treeNodeItem> 
       <li>#{comment.username} #{comment.comment} 
        <o:treeInsertChildren /> 
       </li> 
      </o:treeNodeItem> 
     </ul> 
    </o:treeNode> 
</o:tree>

我願意爲清楚起見，僅String comment屬性重命名爲message或text公積金。

如果您已經使用JSF 2.x，請考慮下面的<my:comments comment="#{bean.comments}">composite component。

<cc:interface componentType="commentsComposite"> 
    <cc:attribute name="comment" type="com.example.Comment" required="true" /> 
</cc:interface> 
<cc:implementation> 
    <c:if test="#{not empty cc.comment.replies}"> 
     <ul> 
      <c:forEach items="#{cc.comment.replies}" var="comment" varStatus="loop"> 
       <li> 
        #{comment.username} #{comment.comment} 
        <my:comments comment="#{cc.parent.comment.replies[loop.index]}" /> 
       </li> 
      </c:forEach> 
     </ul> 
    </c:if> 
</cc:implementation>

@FacesComponent("commentsComposite") 
public class CommentsComposite extends UINamingContainer { 

    private Comment comment; 

    @Override 
    public void setValueExpression(String name, ValueExpression expression) { 
     if ("comment".equals(name)) { 
      setComment((Comment) expression.getValue(getFacesContext().getELContext())); 
     } 
     else { 
      super.setValueExpression(name, expression); 
     } 
    } 

    public Comment getComment() { 
     return comment; 
    } 

    public void setComment(Comment comment) { 
     this.comment = comment; 
    } 

}

又見關於這一主題的博客，recursive tree of composite components。

來源

2012-06-06 16:32:36 BalusC

您可以創建一個包裝Comment的新類。它會有一個評論和一個深度屬性。

public CommentWithDepth { 
    private Comment comment; 
    private int depth; 

    public CommentWithDepth(Comment comment, int depth) { 
     this.comment = comment; 
     this.depth = depth; 
    } 

    public Comment getComment() { 
     return comment; 
    } 
    public int getDepth() { 
     return depth; 
    } 
}

然後創建CommentWithDepth的列表，以正確的順序所有的意見，並在屬性深度評論樹爲基礎水平的深度（0，1爲基礎LEVE的孩子的，2爲下一個，等等）。

現在您可以使用ui：repeat來渲染此列表，並使用depth屬性確定縮進。

來源

2012-06-06 16:34:46 Pablo

組件迭代和JSF

回答

相關問題