Meteor 中的语义-ui 复选框

Question

有人知道如何在 Meteor 中使用 Semantic-ui 复选框（切换）吗？

<div class="ui toggle checkbox">
 <input type="checkbox" name="public">
 <label>Subscribe to weekly newsletter</label>
</div>

复选框/滑块在 html 页面上可见，具有滑动效果，但我不明白如何针对控件进行编码。如何根据值设置选中/未选中以及如何处理事件。

Answer 1

我是这样做的：

Session.set('chosen', false);

Template.myTemplate.onRendered(function () {
  var $elem = this.$('.checkbox');

  // Use 'set unchecked' or 'set checked' instead of 'uncheck'/'check'
  // to avoid triggering the callback.
  // Set initial state here:
  $elem.checkbox('set ' + (Session.get('chosen') ? 'checked' : 'unchecked'));

  // Keep state synced with the session.
  $elem.checkbox({
    onChange: function () {
      Session.set('chosen', !Session.get('chosen'));
    }
  });

});

Meteor 中的语义-ui 复选框

Semantic-ui checkbox in Meteor

checkbox

meteor

semantic-ui