Question

在使用Polymer之前，我想检查是否可以在组件和javascript模型之间进行双向数据绑定。我在网站上阅读了数据绑定部分，但这一点对我来说仍然不明确。

一个简单的例子：如果我在javascript中有一个带有“volume”属性的“audio”模型，我可以将这个volume属性绑定到一个滑块吗？

我对JavaFx更熟悉，这里通常是JavaFx代码，可以解决这个问题：slider.valueProperty().bindBidirectional(audio.volumeProperty())。一旦执行，用户在滑块上所做的任何更改都会反映到模型中，并且应用程序在模型上所做的任何更改都会反映到滑块上。

现在在javascript中，如果我有var audio = { volume: 75, ... }，是否可以将此模型的volume属性绑定到例如纸张滑块的值？

Answer 1

是的，这是可能的。这里有一个例子，有一个简单的模型：

<template is="auto-binding">
  <paper-slider min="10" max="200" value="{{audio.volume}}"></paper-slider>
  <h1>Current volume: {{audio.volume}}</h1>
</template>

<script>
  var audio = {volume: 42, stereo: true, title: "A beautiful song"};

  var template = document.querySelector('template[is="auto-binding"]');

  template.audio = audio

  template.status =0;
  template.statusIsOn = function(value) {
    if (value.status >0)
      return value.count;
    return 0;
  };
</script>

你在这里有一个工作的Plunker：http://plnkr.co/edit/YkyHRIn9ETrNz0vGTPK6?p=preview

如果您需要更多信息，请不要犹豫！

聚合物组件和模型之间的2路数据绑定？

1 个答案: