聚合物的1.x：<纸肘节钮>值不切换为关闭

我不能得到<paper-toggle-button>元件的值以切换到使用<iron-form>.serialize()“关”的值。虽然可视化呈现出现切换到“关”的位置。聚合物的1.x：<纸肘节钮>值不切换为关闭

我在做什么错？

单击演示中的切换按钮以查看其值。
每个按钮的值均设置为“off”。
该第一个点击每个按钮设置值为“开”。
在任何时候切换到“打开”之后，数值从未切换回“关闭”。
每个切换按钮的可视化呈现似乎按预期工作。

http://jsbin.com/ruzuwaqiyi/edit?html,output

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Polymer Bin</title> 
    <base href="http://element-party.xyz/"> 
    <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script> 
    <link rel="import" href="all-elements.html"> 
</head> 
<body class="fullbleed layout vertical"> 
<x-element></x-element> 
<dom-module id="x-element"> 
    <template> 
    <style> 
     paper-toggle-button { 
     display: block; 
     margin-bottom: 40px; 
     } 
    </style> 
    <form is="iron-form" id="form"> 
     <p>Click each button to view the values.</p> 
     <paper-toggle-button name="foo" on-change="handle">foo</paper-toggle-button> 
     <paper-toggle-button name="bar" on-change="handle">bar</paper-toggle-button> 
     <paper-toggle-button name="baz" on-change="handle">baz</paper-toggle-button> 
     <paper-toggle-button name="bat" on-change="handle">bat</paper-toggle-button> 
     <p>See how the values never toggle back to "off?" 
    </form> 
    </template> 
    <script> 
    (function(){ 
     Polymer({ 
     is: 'x-element', 
     handle: function() { 
      alert(JSON.stringify(this.$.form.serialize())); 
     } 
     }); 
    })(); 
    </script> 
</dom-module> 
</body> 
</html>

来源

2015-11-07 Mowzer

我相信这可能是在'铁form'一个错误，这是'连载（）'方法。每个切换按钮的“checked”值是正确的，但是当它被序列化时，似乎忘记设置该值。我建议你做一个GitHub问题：https://github.com/PolymerElements/iron-form/issues – Whyser

现在[问题＃66上'<纸张切换按钮>']（https://github.com/ PolymerElements/paper-toggle-button/issues/66）和['的问题＃78（https://github.com/PolymerElements/iron-form/issues/78））。 – Mowzer

我想我就用<paper-checkbox>元素来代替。 JSBin

http://jsbin.com/dewixacagu/edit?html,output

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Polymer Bin</title> 
    <base href="http://element-party.xyz/"> 
    <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script> 
    <link rel="import" href="all-elements.html"> 
</head> 
<body class="fullbleed layout vertical"> 
<x-element></x-element> 
<dom-module id="x-element"> 
    <template> 
    <style> 
     paper-checkbox { 
     display: block; 
     margin-bottom: 40px; 
     } 
    </style> 
    <form is="iron-form" id="form"> 
     <p>Click each button to view the values.</p> 
     <paper-checkbox name="foo" on-change="handle">foo</paper-checkbox> 
     <paper-checkbox name="bar" on-change="handle">bar</paper-checkbox> 
     <paper-checkbox name="baz" on-change="handle">baz</paper-checkbox> 
     <paper-checkbox name="qux" on-change="handle">qux</paper-checkbox> 
     <p>See how the values toggle back to "off" now?</p> 
    </form> 
    </template> 
    <script> 
    (function(){ 
     Polymer({ 
     is: 'x-element', 
     handle: function() { 
      alert(JSON.stringify(this.$.form.serialize())); 
     } 
     }); 
    })(); 
    </script> 
</dom-module> 
</body> 
</html>

来源

2015-11-08 05:56:33 Mowzer

要用于双向数据绑定到Firebase，[此SO回答也是一个不错的选择]（http://stackoverflow.com/a/33603962/1640892）。 – Mowzer

聚合物的1.x：<纸肘节钮>值不切换为关闭

回答

相关问题