Meteor Handlebars: value in array in {{#each}} block

Question

I'm new to Meteor/Handlebars using the meteor package https://atmospherejs.com/aldeed/plans-stripe which contains these two helpers.

AppPlans.listDefined() - to get the list of all our plans 
 - ["free", "monthly", "yearly"]

AppPlans.get() - to see which plan the user currently has. 
 - ["free"]

And https://github.com/raix/Meteor-handlebar-helpers which has this useful helper:

{{$eq a b}} if a equals b then return true

I'm displaying the plans in my HTML like so:

{{#each AppPlans.listDefined}}

   <strong>{{this}}</strong>

{{/each}}

But I'd like to do is something like this; which doesn't work

{{#each AppPlans.listDefined}}
   {{#if $eq AppPlans.listDefined AppPlans.get}}
        <strong>{{this}}</strong>
   {{else}}
      <span>{{this}}</span>
   {{/if}}
{{/each}}

What would be the best way to solve this issue?

Answer 1

You're currently comparing two arrays, not two scalars. $eq is not going to work. Since you're looping over the plans you actually want to see if the current (scalar) plan this is in the array of plans the current user has.

{{#each AppPlans.listDefined}}
   {{#if $inArray this AppPlans.get}}
        <strong>{{this}}</strong>
   {{else}}
      <span>{{this}}</span>
   {{/if}}
{{/each}}

Then an $inArray helper:

Template.registerHelper('$inArray',function(s,a){
  return a.indexOf(s) > -1;
});