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



>我有一个系统,我可以在vaadin组合框中选择一个值,也可以在另一个div(使用svg)中选择值并动态设置组合的值。如何设置组合的值?

我已经尝试了 value=",但这不起作用...

我只是设置:

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

更新 若要将组合框的值绑定到第一个数组项,请使用计算绑定:

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

其中_getFirstItem()是聚合物对象上的方法:

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>

代码笔


来自vaadin-combobox文档:

您需要提供用户可以使用 items 属性选择的项集。当前选择由valueselectedItem属性指示。可以通过设置 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';

最新更新