Question

我有以下模板和代码在我的网络应用程序中生成“标签”，如示例输出中所示：

模板：

<p class="tag" data-field="tags">Tags:
</p>

Java代码：

@DataField
DivElement tags = DOM.createElement("p").cast();

@Override
public void setModel(MyModel model) {
   binder.setModel(model, InitialState.FROM_MODEL);
   for (String tag : model.getTags()){
       Anchor a = new Anchor();
       a.setText(tag);
       a.setHref("#Tags?id=" + tag);
       tags.appendChild(a.getElement());
       Label comma = new Label(",");
       tags.appendChild(comma.getElement());
   }
}

HTML输出（浏览器）：

<p data-field="tags" class="tag">Tags:

<a class="gwt-Anchor" href="#Tags?id=test">test</a>
<div class="gwt-Label">,</div>
<a class="gwt-Anchor" href="#Tags?id=tagg">tagg</a>
<div class="gwt-Label">,</div>
<a class="gwt-Anchor" href="#Tags?id=new">new</a>
<div class="gwt-Label">,</div>
</p>

我现在面临的问题是从浏览器运行时的HTML输出应该是这样的：

<p data-field="tags" class="tag">Tags:

<a class="gwt-Anchor" href="#Tags?id=test">test</a>,
<a class="gwt-Anchor" href="#Tags?id=tagg">tagg</a>,
<a class="gwt-Anchor" href="#Tags?id=new">new</a>
</p>

而不是在

之间创建gwt-label DIV

Answer 1

而不是

Label comma = new Label(",");
tags.appendChild(comma.getElement());

使用

tags.setInnerHTML(tags.getInnerHTML() + ",");

Answer 2

而不是追加孩子尝试

tags.appendData(",");

Answer 3

我建议使用SafeHTML。 SafeHTML templates也可以使您的代码更简单。

public interface MyTemplate extends SafeHtmlTemplates {
    @Template("<a class=\"gwt-Anchor\" href=\"#Tags?id={0}\">{1}</a>{2}")
    SafeHtml getTag(String url, String text, String comma);
}

（最后一个参数，“逗号”可以是“，”或“”）。

在Anchor小部件之间插入逗号

3 个答案: