Переключатель в помощнике шаблона Meteor

Question

У меня есть шаблон со столом, созданный путем итерации по массиву выбранных пользователем компаний, которые хранятся по тикерному символу в атрибуте документа, который называется selections. Я показываю разные значения, связанные с каждой компанией, в зависимости от другого выбора пользователя, называемого metric.

У меня возникли проблемы с написанием помощника с инструкцией if/else, необходимой для изменения значения в зависимости от выбора пользователя. С приведенным ниже кодом отображаются headingNum и headingDen. Итак, companyName, который связан с индивидуальным выбором. Если я заменил valuationNum на this.reported.capTable.enterpriseValue, появится правильное значение. Но я не могу заставить его появляться при использовании помощника.

<template name="Table"> 
    <div> 
     <table> 
      <thead> 
       <tr> 
        <th>Company</th> 
        <th>{{headingNum}}</th> 
        <th>{{headingDen}}</th> 
       </tr> 
      </thead> 
      <tbody> 
       {{#each selections}} 
        <tr> 
         <td>{{companyName}}</td> 
         <td>${{valuationNum}}</td> 
         <td>${{valuationDen}}</td> 
        </tr> 
       {{/each}} 
      </tbody> 
     </table> 
    </div> 
</template> 

JS файл

var metric = this.metric; 
var period = this.period; 
Template. Table.helpers({ 
    selections: function() { 
     var selected = this.selections; 
     return Companies.find({ticker: {$in: selected}}) 
    }, 
    headingNum: function() { 
     switch (metric) { 
      case "A": 
       return "EV"; 
       break; 
      case "B": 
       return "Price"; 
       break; 
      default: 
       return "EV" 
     } 
    }, 
    valuationNum: function() { 
     switch (metric) { 
      case "A": 
       return this.reported.capTable.enterpriseValue; 
       break; 
      case "B": 
       return this.reported.capTable.lastClose; 
       break; 
      default: 
       return "" 
     } 
    } 
}); 

Я попытался вырваться в {{#each}} {{}} каждый блок в новый шаблон, чтобы увидеть, если это поможет с контекстом данных, но не повезло (и это испортит таблицу).

Я правильно пишу этих помощников? Я также получаю сообщение об ошибке в файле JS, так как reported - нерешенная переменная, хотя это правильный путь.

спасибо.

EDIT:

Этот помощник работает, не знает, почему другие не делают:

headingNum: function() { 
    var metric = this.metric; 
    switch (metric) { 
     case "EV/EBITDA": 
      return "EV"; 
      break; 
     case "Price/Earnings": 
      return "Price"; 
      break; 
     default: 
      return "" 
    } 
} 

Answer 1

шаблона Метеора построен на blaze, который является реактивной конструкцией. Это означает, что шаблон будет повторно отображаться только при изменении значений зависимостей данных. В этом примере только при изменении Companies. Однако, когда вы изменяете значение metric, шаблон не будет повторно отображаться, поэтому вы не видите ожидаемое изменение.

Реактивный способ достижения своей цели на самом деле положить в метрической логике переключателя прямо внутри шаблон:

{{#each selections}} 
    <tr> 
     <td>{{companyName}}</td> 
     {{#if metricA}} 
     <td>${{reported.capTable.enterpriseValue}}</td> 
     {{else}} 
     <td>${{reported.capTable.lastClose}}</td> 
     {{/if}} 
     <td>${{valuationDen}}</td> 
    </tr> 
{{/each}} 

Внутри вашего JS:

Template. Table.helpers({ 
    metricA: function() { 
     return this.metric == 'A'; 
    } 
}) 

Answer 2

только имея быстрое просматривание над вашим кодом , всего несколько вещей.

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

Я бы сказал, чтобы сделать это действительно эффективным, вы хотите иметь помощник и обработчик события, чтобы отслеживать получение и установку метрики реактивно (реактивно-вар пакет помогает для этого)

Настройки метрики реактивных переменной

Template.Table.created = function() { 
    this.metric = new ReactiveVar();          
} 

Получить метрика

Template.Table.helpers({ 
    getMetric: function() { 
    return this.metric.get(); 
    } 
}) 

Установите метрические

Template.Table.events({ 
    'click .setMetric': function(event, template) { 
    event.preventDefault(); 
    var metric = $(event.target).data('metric'); 
    if(metric) template.data.metric.set(metric); 
    } 
}); 

Затем, используя эту стратегию, вы можете просто иметь помощник для своих заголовков и ценностей - определение показателя по требованию и ограничение его.