Как создать составной компонент с динамическими атрибутами? - PullRequest
2 голосов
/ 01 августа 2011

У меня есть этот составной компонент:

<cc:interface>
    <cc:attribute name="image_1" />
    <cc:attribute name="image_2" />
    <cc:attribute name="image_3" />
</cc:interface>

<cc:implementation>
    <div id="slider-container">
        <div id="slider-small">
            <h:graphicImage library="images" name="#{cc.attrs.image_1}" />
            <h:graphicImage library="images" name="#{cc.attrs.image_2}" />
            <h:graphicImage library="images" name="#{cc.attrs.image_3}" />
        </div>
    </div>
</cc:implementation>

Я использую его следующим образом:

<cs:small_slider 
    image_1="about/1.jpg"
    image_2="about/2.jpg"
    image_3="about/3.jpg"
/>

, но ограничен тремя атрибутами.Что мне делать, если мне нужно отправить более трех, используя один и тот же составной компонент, например:

<cs:small_slider 
    image_1="about/1.jpg"
    image_2="about/2.jpg"
    image_3="about/3.jpg"
    image_4="about/4.jpg"
    image_5="about/5.jpg"
/>

Я хочу сделать это, чтобы повторно использовать компонент, и я не хочу создавать другой.

ОБНОВЛЕНИЕ : При использовании подхода @BalusC выполняется следующий HTML:

<!-- small slider --> 
<div id="slider-container"> 
    <div id="slider-small">
        <img src="/brainset/javax.faces.resource/1.jpg.xhtml?ln=images" />
        <img src="RES_NOT_FOUND" />
        <img src="RES_NOT_FOUND" /> 
    </div> 
    <div id="frame-slider-small"></div> 
</div><!-- end #slide-container --> 

Не найдено других изображений, только первое.Я уверен, что эти изображения: 'about / 2.jpg' и 'about / 3.jpg' существуют.

Ответы [ 2 ]

3 голосов
/ 01 августа 2011

Это невозможно, и это также нарушает принцип СУХОЙ .

Лучше всего ставить либо , передавая его как List<String> от боба, чтобы вы могли повторить его, используя <ui:repeat>:

<cs:small_slider images="#{bean.images}" />

с

<cc:interface>
    <cc:attribute name="images" type="java.util.List" required="true" />
</cc:interface>

<cc:implementation>
    <div id="slider-container">
        <div id="slider-small">
            <ui:repeat value="#{cc.attrs.images}" var="image">
                <h:graphicImage library="images" name="#{image}" />
            </ui:repeat>
        </div>
    </div>
</cc:implementation>

Или вместо этого определите ее как жестко запятую строку, разделенную запятыми, и используйте JSTL fn:split(), чтобы разбить их на String[], который вы, в свою очередь, передаете в <ui:repeat>:

<cs:small_slider images="about/1.jpg,about/2.jpg,about/3.jpg" />

с

<cc:interface>
    <cc:attribute name="images" type="java.lang.String" required="true" />
</cc:interface>

<cc:implementation>
    <div id="slider-container">
        <div id="slider-small">
            <ui:repeat value="#{fn:split(cc.attrs.images, ',')}" var="image">
                <h:graphicImage library="images" name="#{image}" />
            </ui:repeat>
        </div>
    </div>
</cc:implementation>

Не связано с конкретной проблемой, попытайтесь соответствовать соглашениям об именах Java / JSF. Я бы переименовал ваш small_slider.xhtml в renameSlider.xhtml, чтобы вы могли использовать его как <cs:smallSlider>, что прекрасно согласуется со всеми обычными компонентами JSF.

0 голосов
/ 02 августа 2011

Другой альтернативой упомянутым решениям BalusC было бы (ab) использовать вложенные теги f:param. Это также позволило бы передать дополнительный параметр на изображение в составной компонент. Атрибут name в следующем примере является необязательным:

<cs:slider>
    <f:param name="image1" value="image1"/>
    <f:param name="image2" value="image2"/>
    <f:param name="image3" value="image3"/>
</cs:slider>

С составным компонентом, определенным так:

<cc:interface>
</cc:interface>

<cc:implementation>
    <div id="slider-container">
        <div id="slider-small">
            <c:forEach items="#{cc.children}" var="param">
                <h:graphicImage library="images" name="#{param.value}" title="#{param.name}"/>
            </c:forEach>
        </div>
    </div>
</cc:implementation>

Поскольку ваша исходная проблема уже была решена, я пишу это больше, чтобы получить отзывы об этом подходе.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...