Question

我有一个系统，我可以在vaadin-combobox中选择一个值，或者选择另一个div中的值（带有svg）并动态设置组合的值。如何设置组合的值？

我已经尝试过值=＆＃34;＆＃34;，但这没有用......

Answer 1

UPDATE 要将组合框的值绑定到第一个数组项，您需要使用计算绑定：

<vaadin-combo-box
  value="[[_getFirstItem(sessions)]]"
  ...>
</vaadin-combo-box>

其中_getFirstItem()是Polymer对象上的方法：

Polymer({
  is: 'x-foo',
  ...
  _getFirstItem: function(sessions) {
    return sessions.length > 0 && sessions[0];
  }
});

＆＃13;

<head>
  <base href="https://polygit.org/polymer+1.5.0/components/">
  <script src="webcomponentsjs/webcomponents-lite.min.js"></script>
  <link rel="import" href="https://cdn.vaadin.com/vaadin-core-elements/master/vaadin-combo-box/vaadin-combo-box.html">
</head>
<body>
  <x-foo></x-foo>

  <dom-module id="x-foo">
    <template>
      <vaadin-combo-box
        label="Element"
        items='[[sessions]]'
        value="[[_getFirstItem(sessions)]]">
      </vaadin-combo-box>
    </template>
    <script>
      HTMLImports.whenReady(function() {
        Polymer({
          is: 'x-foo',
          properties : {
            sessions: {
              type: Array,
              value: function() {
                return ["Bohrium", "Boron", "Bromine", "Cadmium", "Caesium", "Calcium"];
              }
            }
          },
          _getFirstItem: function(sessions) {
            return sessions.length > 0 && sessions[0];
          }
        });
      });
    </script>
  </dom-module>
</body>

＆＃13;

^codepen

来自docs for vaadin-combobox：

您需要提供用户可以使用items属性选择的项目集。当前选择由value和selectedItem属性指示。您可以通过设置value属性以编程方式设置或更改选择。这样做也会更新可见字段。

以声明方式设置项目时，请注意属性值必须是有效的JSON字符串。您需要对值中的属性值和双引号使用单引号（在JSON字符串中）。或者，您可以在值内转义双引号。
<vaadin-combo-box
  label="Element"
  items='["Bohrium", "Boron", "Bromine", "Cadmium", "Caesium", "Calcium"]'
  value="Bromine">
</vaadin-combo-box>
以编程方式设置项目和值：
var combobox = document.querySelector('vaadin-combo-box');
combobox.items = ['Bohrium', 'Boron', 'Bromine', 'Cadmium', 'Caesium', 'Calcium'];
combobox.value = 'Bromine';

Answer 2

我只是设置：

item-label-path="nombreCorto" item-value-path="idWaEmpresa" value="1"

将值设置为vaadin组合框（聚合物）

2 个答案: