Using a template to make adding tables less work?

I have an application where many, many views have tables in them. I used Blaze templates on the page to display the table as it’s own template, but as I was working to make style changes, realized I’m repeating a lot of work to set styles inline dynamically on each template (I know - css can probably do this, but I’m using the Materialize library with their helper classes to change background and text color based on user selections).

Anyway as I was working through this, I started thinking, I’m putting the dynamic changes at the

level on each table. Instead of doing that is there some kind of inheritance built into meteor templates? Could I somehow just change the column data inside of a template with the tag and color change logic?

Nothing jumps out at me, so thought I would ask about using the templating for this purpose.

Seems like I can pass in some variables to the template maybe to help make this easier.

<tamplate name="myTables">
.
.
.
  <tbody>
    {{#each dataInfo}}
       <tr id="{{_id}}" class="infoView">
        {{#if $eq view "ladderSalesView"}}
          {{> ladderSalesView}}
        {{else if $eq view "hoseSalesView"}}
          {{> hoseSalesView}}
        {{/if}}
      </tr>
    {{/each}}
  </tbody>
 </table>
</template>

and call it like this maybe?

{{> myTables dataInfo=myDataObject view="hoseSalesView"}}

Am I way off?

That looks like it would work fine, but you can skip creating a large if block and just use Template.dynamic to load the template matching the name passed in as view

<template name="myTables">
.
.
.
  <tbody>
    {{#each dataInfo}}
       <tr id="{{_id}}" class="infoView">
         {{> Template.dynamic template=view }}
      </tr>
    {{/each}}
  </tbody>
 </table>
</template>
1 Like