meteor
Blaze Templating

Вступление

Заполнение шаблона при вызове метода

<template name="myTemplate">
  {{#each results}}
    <div><span>{{name}}</span><span>{{age}}</span></div>
  {{/each}}
</template>

Template.myTemplate.onCreated(function() {
  this.results = new ReactiveVar();
  Meteor.call('myMethod', (error, result) => {
    if (error) {
      // do something with the error
    } else {
      // results is an array of {name, age} objects
      this.results.set(result);
    }
  });
});

Template.myTemplate.helpers({
  results() {
    return Template.instance().results.get();
  }
});

Контекст данных шаблона

Всякий раз, когда вызывается шаблон, контекст данных по умолчанию шаблона неявно получен от вызывающего, как в примере childTemplate получает контекст данных parentTemplate, т. Е. Шаблон вызывающего абонента

<template name="parentTemplate">
    {{#with someHelperGettingDataForParentTemplate}}
    <h1>My name is {{firstname}} {{lastname}}</h1>
    //some stuffs here
    {{> childTemplate}}
    {{/with}}
</template>

В приведенной выше ситуации любые данные, получаемые вспомогательным экстрактом для родительского шаблона, автоматически получаются с помощью childTemplate. Например, к {{firstname}} и {{lastname}} можно получить доступ с childTemplate, как показано ниже.

<template name="childTemplate">
<h2>My name is also {{firstname}} {{lastname}}</h2>
</template>

Мы даже можем явно определить контекст данных childTemplate, передав аргументы шаблону, как показано ниже.

<template name="parentTemplate">
    {{#with someHelperGettingDataForParentTemplate}}
    <h1>My name is {{firstname}} {{lastname}}</h1>
    //some stuffs here
    {{> childTemplate childData=someHeplerReturningDataForChild}}
    {{/with}}
</template>

Предполагая, что helper someHelperReturningDataForChild возвращает объект, например {профессия: «Разработчик метеоров », хобби: «stackoverflowing»}, этот конкретный объект будет явным контекстом данных для childTemplate. Теперь в шаблоне для детей мы можем сделать что-то вроде

<template name="childTemplate">
    <h2>My profession is {{profession}}</h2>
    <h3>My hobby is {{hobby}}</h3>
</template>

Шаблоны Помощники

Шаблоны-помощники являются неотъемлемой частью Blaze и обеспечивают как бизнес-логику, так и реактивность на Шаблон. Важно помнить, что помощники шаблонов - это фактически реактивные вычисления , которые повторяются при каждом изменении их зависимостей. В зависимости от ваших потребностей помощники шаблонов могут быть определены глобально или ограничены определенным шаблоном. Ниже приведены примеры каждого подхода к определению вспомогательных элементов шаблона.

1. Пример помощника шаблона, привязанного к одному шаблону.

Сначала определите свой шаблон:

<template name="welcomeMessage">
  <h1>Welcome back {{fullName}}</h1>
</template>

Затем определите помощник шаблона. Это предполагает, что контекст данных шаблона содержит свойство firstName и lastName.

Template.welcomeMessage.helpers({
  fullName: function() {
    const instance = Template.instance();
    return instance.data.firstName + ' ' + instance.data.lastName
  },
});

2. Пример глобального помощника шаблона (этот помощник можно использовать из любого шаблона)

Сначала зарегистрируйте помощника:

Template.registerHelper('equals', function(item1, item2) {
  if (!item1 || !item2) {
    return false;
  }

  return item1 === item2;
});

С помощью помощника equals я могу теперь использовать его в любом шаблоне:

<template name="registration">
  {{#if equals currentUser.registrationStatus 'Pending'}}
    <p>Don't forget to complete your registration!<p>
  {{/if}}
</template>