Vaadin23访问从自定义渲染器输入到ComboBox的搜索项

Question

我为ComboBox项实现了自定义ComboBox：

private Renderer<CompositeEntityResult> createRenderer() {

        StringBuilder tpl = new StringBuilder();

        tpl.append("<div style=\"display: flex;\">");
        tpl.append("  <div>");
        tpl.append("    <span ${item.name}</span>
...

comboBox.setRenderer(createRenderer());

是否有可能以某种方式将输入的搜索项访问到呈现器HTML标记中的ComboBox？此外，用于此标记的模板引擎是什么？

更新

private Renderer<CompositeEntityResult> createRenderer() {

        StringBuilder tpl = new StringBuilder();

        tpl.append("<div style=\"display: flex;\">");
        tpl.append("  <div>");
        tpl.append("    <span ${item.name}</span>
...

 return LitRenderer.<CompositeEntityResult>of(tpl.toString())
                .withProperty("name", e -> "< b>" + e.getName() + < /b>))

现在，它看起来就像ComboBox窗口中的纯文本，就像<b>somename</b>一样，但是我希望用粗体代替。

Answer 1

在用户离开输入字段之前，您必须使用JavaScript获取值：

comboBox.getElement()
   .executeJs("return this.querySelector('input').value")
   .then(String.class, value -> { // use the value });

回答你的第二个问题：

private Renderer<CompositeEntityResult> createRenderer() {

    StringBuilder tpl = new StringBuilder();

    tpl.append("<div style=\"display: flex;\">");
    tpl.append("  <div>");
    tpl.append("    <span><b>${item.name}</b></span>
...

return LitRenderer.<CompositeEntityResult>of(tpl.toString())
            .withProperty("name", e -> e.getName() ))