将值设置为 vaadin 组合框(聚合物)

Set value to vaadin combobox(polymer)

我有一个系统,我可以在其中 select vaadin-combobox 中的值或 select 另一个 div 中的值(使用 svg)并动态设置组合的值.如何设置组合的值?

我已经尝试过 value="",但这没有用...

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];
  }
});

<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>

codepen


来自 docs for vaadin-combobox:

You need to provide the set of items which the user can select with the items property. Current selection is indicated by the value and selectedItem properties. You can set or change the selection programmatically by setting the value property. Doing so also updates the visible fields.

When setting the items declaratively, notice that the attribute value needs to be a valid JSON string. You need to use single quotes for the attribute value and double quotes inside the value (in the JSON string). Alternatively, you can escape the double quotes inside the value.

<vaadin-combo-box
  label="Element"
  items='["Bohrium", "Boron", "Bromine", "Cadmium", "Caesium", "Calcium"]'
  value="Bromine">
</vaadin-combo-box>

Setting the items and value programmatically:

var combobox = document.querySelector('vaadin-combo-box');
combobox.items = ['Bohrium', 'Boron', 'Bromine', 'Cadmium', 'Caesium', 'Calcium'];
combobox.value = 'Bromine';

我简单设置:

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