<styles> 中的 Polymer 1.0 数据绑定

Question

我正在再次尝试 Polymer，我想做一些事情，但它不起作用，而且解决方法看起来很乱。我想设计一个元素的样式，但要利用数据绑定。基本上我尝试这样做：

<dom-module id="proto-element">
  <template>
    <style>
      #wrapper{
        width:{{pixels}};
        background: #e1e1e1;
      }
      #bar{
        width:80%;
      }
    </style>
   <div id="wrapper">
     <div id="bar" style$={{barStyle}}>I'm the bar! <b>{{test}}</b></div>
   </div>
  </template>
</dom-module>

<script>
Polymer({
  is: "proto-element",
  ready: function() {
    this.pixels = "300px";
    this.test = "Fear me!"
  }
});
</script>

绑定到 this.test 的文本完美无缺。但是样式内部的小胡子标签会被忽略。有一个简单的解决方案吗？因为在处理多个 css 规则时使用内联 style$= 语法非常混乱，而且如果您想要的值是在别处获得的，则您总是需要连接一个字符串才能使其工作。对干净的解决方案有什么想法吗？

Answer 1

恐怕您想要的（至少目前）不可能。数据绑定仅在

<styles> 中的 Polymer 1.0 数据绑定

Polymer 1.0 Data Binding in <styles>

html

data-binding

polymer