Aurelia绑定样式复选框

Aurelia binding on styled checkboxes

本文关键字：复选框 样式 绑定 Aurelia      更新时间：2023-09-26

我在Aurelia中使用Semantic- ui，发现绑定语义样式的复选框只能以一种方式工作。

我已经创建了一个Plunker来演示:http://embed.plnkr.co/YPyKT0dwubzDCqEPmEPx/preview

在这个例子中，我使用复选框来过滤一个数组。是否有一个不同的方法，我应该使用，将工作与样式复选框?

Aurelia绑定系统正在监听输入的change和input事件。当这些被触发时，绑定将被刷新。

Semantic UI复选框使用jquery在更新输入的checked属性时触发一个change事件。由于某些原因，由jquery触发的合成更改事件没有被Aurelia捕获，它使用标准的addEventListener函数来订阅事件。

这里有一个解决方法:

原始代码:

$('.ui.checkbox').checkbox();

处理:

$('.ui.checkbox').checkbox()
  .on('change', e => fireEvent(e.target, 'input'));
function createEvent(name) {
  var event = document.createEvent('Event');
  event.initEvent(name, true, true);
  return event;
}
function fireEvent(element, name) {
  var event = createEvent(name);
  element.dispatchEvent(event);
}

更新后的柱塞:http://plnkr.co/edit/qG850rRZag0Vb8FM1HZP?p=info

相关文章：