javascript - 如何将下拉值传递给模板助手。 [ meteor +火焰]

Question

我正在尝试创建一个模板，以便在开头有一个下拉列表，通过 mongo 填充。我有第二个模板，它显示一个表格，其中包含基于上面所做选择的更多详细信息。为了在表中显示内容，我必须首先能够检索从下拉列表中选择的值。我到底该怎么做？

我尝试使用 this.schemaName 和 defaultTemplate.schemaName 检索它，但没有帮助。

模板:

<template name ='defaultTemplate'>

    <div class="form-group" data-required="true">
        <label for="Schema" class="control-label">Select the Schema</label>
        <select required="true"  class="form-control">
            <!-- <option default>Select Schema </option> -->
            {{ #each schemaNames}}
            <option >{{schemaName}}</option>
            {{/each}}
        </select>
        <span class="help-block"></span>
    </div>
    {{> tableTemplate}}
</template>

<template name="tableTemplate">

    <table class="table table-bordered table-condensed">
      <thead>
        <tr>
          <td style="width: 85px">Label</td>
          <td>Current Value</td>
          <td style="width: 250px">New Value</td>
        </tr>
      </thead>
      <tbody>
        {{#each schemaLabels}}
          <tr>
            <td>{{this.label}}</td>
            <td>{{this.value}}</td>
            <td>
            {{#autoForm id=makeUniqueID type="update" collection=Defaults doc=this autosave=true}}
              {{> afFormGroup name="value" label=false}}
            {{/autoForm}}
            </td>
          </tr>
        {{/each}}
      </tbody>
    </table>
</template>

助手:

import { Template } from 'meteor/templating';
import '../templates/defaultTemplate.html';

Template.defaultTemplate.helpers({
   schemaNames: function () {
       return Defaults.find({},{schemaName:1}).map(function(c) {return {schemaName : c.schemaName};
       });
   },
   schemaLabels: function() {
       var selectedSchema = defaultTemplate.schemaName;
      // alert (selectedSchema); >>>>>>>>>> Displays Undefined <<<<<<<<<<<
       return Defaults.find({schemaNeme:selectedSchema},{schemaName:0,_id:0}).map(function(c) {return {label : c.label, value: c.value};
       });
   }
 });

Answer 1

查看我的回答 here

基本上，您在模板中创建一个响应式变量来存储下拉列表的“状态”，本例中的状态是所选的值。然后，您有一个事件处理程序，可以在值更改时更新状态(我会在下拉列表中同时使用 click 和 change，也许还有其他一些)。最后，您有一个助手可以根据状态返回一些信息。

您从助手返回的信息根据您的用途而有所不同。在某些情况下，您需要返回 true/false 类型响应，例如“应禁用此组件”，但在其他情况下，例如您的情况，我认为您希望返回下拉列表的值，并实际将该值传递给您的表模板。然后，您的表格模板应该根据传入的值决定显示什么。例如，如果我传入 null 或 undefined，那么我的表可能会显示一个“已禁用”表，并覆盖一个“未进行选择”的覆盖层，但如果我通过值，然后在订阅中使用该值来获取数据以填充表。这样，无论传入什么值，表格都应该始终能够显示一些内容。