反应性`material_select`无法按预期工作

Question

在表单中向用户显示四个选择框。每个选择框必须具有唯一值，这些选项来自Products集合。当取值时，选择应该被动地改变以显示剩余的未被取消的选项。

我的第一堂课是指总体形式。

class SelectForm extends BlazeComponent {
  onCreated() {
    super.onCreated();
    this._selected = new Mongo.Collection(null);
    _.range(4).map(i => this._selected.insert({
      slot: i,
      product: undefined
    }));
  }
}

然后我为每个选择框都有一个类，它反应性地应该重新运行实现选择功能。

class SelectBox extends BlazeComponent {
  onRendered() {
    super.onRendered();
    this.autorun(() => {
      const selected = this.parentComponent()._selected.find();
      this.$('select').material_select();
    });
  }
  taken() {
    return this.parentComponent()._selected.find({
      product: { $ne: undefined }
    }).map(product => product._id);
  }
  options() {
    return Products.find({
      _id: { $nin: this.taken() }
    }).map(product => ({
      label: product.name,
      value: product._id
    }));
  }
}

但是，这永远不会重新呈现选项，或更改其值。

这是为什么？如何反应性更新材料选择？