物质化 /选择表格不起作用

Question

我正在尝试在我的流星应用程序上使用实现的选择表格，但似乎不起作用....

这是我的代码：

html

<template name="createAutomatedaction">
    <div class="input-field col s12">
      <select>
        <option value="" disabled selected>Choose your option</option>
        <option value="1">Option 1</option>
        <option value="2">Option 2</option>
        <option value="3">Option 3</option>
      </select>
      <label>Materialize Select</label>
    </div>
</template>

JS

Template.createAutomatedaction.onRendered(function(){
  this.$('select').material_select();
});

当我单击"选择表单"时，下拉菜单不会显示。谁能告知我任何机会我错过的东西？您的帮助将不胜感激。

这个https://www.dropbox.com/s/nzh7sp5x7by6e1t/screenshot 2015-05-09 18.2018.20.54.png?dl = 0

没有这个https://www.dropbox.com/s/e1asl3y5pbtg5yp/screenshot 2015-05-09 18.2408.24.08.png?dl=0

Answer 1

select初始化的正确代码就是这样（假设'createAutomatedAction'是您的模板的名称）

Template.createAutomatedaction.onRendered(function() {
  $('select').material_select();
});

如果您使用的是abletible（v0.97.2）的最后一个（撰写）版本，则有一个错误，导致下拉下的下拉列表不被固定在此提交上。

如果您想快速手动修复它，请从其存储库中获取未启动的JS（dist/js/stalietize.js），然后将" $ hody"的每个实例替换为" bodyelement"，然后使用它。

选择将起作用。

Answer 2

将jQuery代码放在模板事件中：

Template.templatename.events({
      this.$('select').material_select();
});

希望它有效

Answer 3

在select标签中添加class="browser-default"为我工作。

Answer 4

我删除了class="input-field"，它对我有用。