Polymer 控制纸张复选框'；s州

我正在尝试设置一个元素，其中有一个

纸质复选框

。我希望复选框的选中状态由ajax调用的响应控制

HTML:

自定义元素：

<polymer-element name="epic-list-episode" attributes="checked">

  <template>
    <link rel="stylesheet" href="epic-list-episode.css.scss" />
    <div horizontal layout center>
      <div flex>
        <content></content>
      </div>
      <div vertical layout>
        <paper-checkbox checked?="{{checked === 'true'}}" on-change="{{changeHandler}}"></paper-checkbox>
      </div>
    </div>
  </template>

  <script>
    Polymer({
      changeHandler: function(event) {
        //Send ajax, wait for error/success callback
        //checkbox.checked = response from ajax
      }
    });
  </script>

</polymer-element>

聚合物({
changeHandler:函数（事件）{
//发送ajax，等待错误/成功回调
//checkbox.checked=来自ajax的响应
}
});

如何做到这一点？我尝试了

返回false

，但复选框仍会切换动画

为了澄清，以下是我想要的流程：

复选框未选中

我点击复选框（我还不想让它切换）

Ajax请求已发送

等待回调

如果成功，请切换复选框的状态

---

我认为您根本不需要选中

属性

您可以做的是，当调用
on change
时，将
纸质复选框的
checked
属性设置回其以前的值。然后在ajax回调之后，将其设置回应该的状态

changeHandler: function (event, detail, sender) {
    this.$.checkbox.checked = !this.$.checkbox.checked;

    // give the checkbox a little loading animation
    var loading = new CoreAnimation();
    loading.duration = 750;
    loading.easing = 'ease-in';
    loading.keyframes = [{ opacity: 1, transform: "scale(1)" }, { opacity: 0.4, transform: "scale(0.9)" }];
    loading.direction = 'alternate';
    loading.iterations = '1000';
    loading.target = this.$.checkbox;
    loading.play();

    // give it a little delay to act like a callback
    this.job('delay', function () {
        // stop the animation
        loading.finish();

        this.$.checkbox.checked = !this.$.checkbox.checked;
    }, 3000);
}

请注意，我还包括一些动画代码，让用户感觉
纸质复选框
正在做一些事情，以获得更好的用户体验。请看下面的工作示例。
实际上有几种方法。我制作这本书是为了展示我做这件事的两种方法

使用声明性绑定

<paper-checkbox checked="{{checked}}" on-change="{{changeHandler}}"></paper-checkbox>

和纯js

<paper-checkbox id="box" on-change="{{changeHandler}}"></paper-checkbox>

您所说的“复选框仍执行其切换动画”是什么意思？复选框在未选中/选中之间设置动画。我更新了这个问题并做了一些澄清。checked属性用于设置页面加载的初始状态。有些是检查过的，有些不是
将纸张复选框的checked属性设置回其以前的值。
我想这就是我想要的。我也不知道
CoreAnimation
。谢谢：）当我有机会尝试时，我会接受的。
this.checked = true;

<paper-checkbox id="box" on-change="{{changeHandler}}"></paper-checkbox>

var box = document.querySelector("#box");
box.checked = true;