Access helper properties with 'each'


#1

Hello,
I have this post document schema:

{
    "_id" : "FbMqyiHgrN3G64xiP",
    "owner" : "MzvgkL46qWg8QmEFe",
    "description" : "",
    "options" : {
        "addFrame" : true,
        "addCorner" : true,
        "addRibbon" : false,
    },
   "img" : {
        "dataURL" : ""data:image/jpeg;base64,/9j/4AAQSk...."
   }
}

They are displayed in(jade):

template(name='main')
  each posts
   .thumbContainer(class="#{addFrame}")
     img(src="#{img.dataURL}"
    .corner(class="#{addCorner}")
    .ribbon(class="#{addRibbon}")

And I would like to have the following helper logic(coffee):

Template.main.helpers
  posts: -> Posts.find({})
  addFrame: -> if posts.options.addFrame then return 'hasFrame'
  addCorner: -> if posts.options.addCorner then return '.visible'
  addRibbon: -> if posts.options.addRibbon then return '.visible'

How can this logic be achieved?


#2

Create a Template Helper that will return a class name

Template.registerHelper('showFrame', function(frame) {
  if ( frame)
    return framer // framer will be you class name
});



 {{#each posts}}
        <div class = {{ showFrame 'options.addFrame' }} >
              show something here
      </div>
{{/each}}

define CSS

   .framer {
           define here
     };

#3

another solution without a Template Helper is below but I haven’t tried it though

{{#each posts}}
       
   {{#if options.addFrame}}
        <div class ="framer" >
             show something here
         </div>
   {{else}}
         <div>
             show something here too
          </div>
   {{/if}}

{{/each}}

#4

normaly in spacebars I just do

<div class="{{#if options.addFrame}} hasFrame{{/if}}">

or use child template inside #each and than in helper something like

Template.currentData().options.addFrame

or

Template.instance().data.options.addFrame

it is just morning and these reactive/nonreactive data context handlers are little mixed up for me :smiley:


#5

@shock whats the difference the two ?

Template.currentData().options.addFrame

and

Template.instance().data.options.addFrame

#6

currentData is reactive while .data not etc etc… as written in docs