Question

在我的meteor应用程序中，我有一个数据收集表单模板，如下所示：

<template name="IntroductionWizard_Step_1">
{{#with contributor}}
<div class="container">
  <div class="hero-unit">
    <h3 class="panel-title">Introduction Wizard Step 1: </h3>

    <form class="form-vertical" role="form">
      <label for="name" class="control-label"><h5 class="text-muted">Name</h5></label>
      <input type="text" id="name" name="name" class="form-control-element" value="{{contributorName}}" placeholder="Name">

      <label for="email" class="control-label">Email</label>
      <input type="text" id="email" name="email" class="form-control-element" value="{{contributorEmail}}" placeholder="Email">

      <label for="phone" class="control-label">Phone</label>
      <input type="text" id="phone" name="phone" class="form-control-element" value="{{contributorPhone}}" placeholder="phone #">

      <label for="orgRole" class="control-label">Org Role</label>
      <input type="text" id="orgRole" name="orgRole" class="form-control-element" value="{{contributorOrgRole}}" placeholder="Org Role">
    </form>

  </div>
</div>
{{/with}}
</template>

此模板的帮助器如下所示：

Template["IntroductionWizard_Step_1"].helpers({
  contributor: function(n) {
    return ContributorCollection.findOne({contributorName: "Jim Szczygiel"});
  }
});

此助手可以返回数据（如果找到），或者不返回数据。目前，当返回数据时，它以这种形式显示，但是，当没有返回数据时，则此页面显示为空 - 表单模板根本不显示。即使没有返回数据，我该怎么做才能显示一个空的模板表单？

Answer 1

with就像一个if加上一个命名空间，所以你看到的是有道理的 - 整个表格都会被有条件地删除。可能有用的只是删除with，而是使用每个值的全名。 e.g：

value="{{contributor.contributorName}}"

我刚做了一点测试，发现即使contributor没有定义，它似乎也没有失败。

Answer 2

在这种情况下你能回复一个空字符串吗？如果fineOne返回undefined，它将返回""。有一次在Blaze中返回undefined会使Deps崩溃，不确定是否仍然如此。

Template["IntroductionWizard_Step_1"].helpers({
  contributor: function(n) {
    return ContributorCollection.findOne({contributorName: "Jim Szczygiel"}) || "";
  }
});

Answer 3

这对您来说可能是一个简单的解决方案。要模拟模板助手没有返回数据的情况，只需注释return语句。

<强> HTML

<body>
  {{> IntroductionWizard_Step_1}}
</body>

<template name="IntroductionWizard_Step_1">
   <!-- if contributor is found ContributorTemplate is included with the returned object as data context -->
   {{#with contributor}}
       {{> ContributorTemplate}}
   {{/with}}

    <!-- if contributor is NOT found ContributorTemplate is included with an empty object as data context -->
   {{#unless contributor}}
       {{> ContributorTemplate}}
   {{/unless}}
</template>

<template name="ContributorTemplate">
  <input value="{{contributorName}}" placeholder="Name">
</template>

<强> JS

if (Meteor.isClient) {
  Template.IntroductionWizard_Step_1.contributor = function () {
    return {contributorName:  "Jim Szczygiel"}; // comment this line to see effect!
  };
}

<强>结果

返回对象：

enter image description here

没有返回的对象：

enter image description here

meteor app - 当模板助手没有返回数据时如何显示空模板

3 个答案: