Last Updated: February 25, 2016
· guilhermedecampo

Meteor make widgets easy on new blaze engine

Making widgets on the new blaze template is really easy!

You just have to create four things:

1 - Your widget's template

For example an image of an album that shows a list of musics when clicked.

<template name="albumPlusInfo">
<img id="infoButton" data-placement="top" data-toggle="popover" data-container="body" data-trigger="click" data-content="
    <table class='table table-hover'>
            {{#each displayMusics}}
                    <td>{{musicQuality}}★ ★ ★ </td>
    <button class='btn goOrder'>Buy Album Now!</button>

2 - Helpers for the widget's template

Get the info from the Musics mongo collection

   displayMusics: function() {
     return Musics.find();

3 - Events for the widget's template

Using iron-router to route to the buy page{
   'click .goOrder: function (event, template) {

4 - Call popover function each time widget is rendered

Using boostrap popover

Template.albumPlusInfo.rendered = function () {

Making widgets in the new blaze engine is cool!
Try it out!

1 Response
Add your response

Great post.
I am still missing, how can I listen for event like
'click .music-name' : function()......
<td class='music-name'>{{musicName}}</td>

over 1 year ago ·