- Building Single:page Web Apps with Meteor
- Fabian Vogelsteller
- 331字
- 2021-08-06 19:29:37
Displaying data with template helpers
Each template can have functions, which are called template
helpers, and they can be used inside the template and child templates.
In addition to our custom helper functions, there are three callback functions that are called when the template is created, rendered, and destroyed. To display data with template helpers, perform the following steps:
- To see the three callback functions in action, let's create a file called
home.js
and save it to ourmy-meteor-blog/client/templates/
folder with the following code snippet:Template.home.created = function(){ console.log('Created the home template'); }; Template.home.rendered = function(){ console.log('Rendered the home template'); }; Template.home.destroyed = function(){ console.log('Destroyed the home template'); };
If we now open the console of our browser, we will see the first two callbacks are being fired. The last one will only fire if we dynamically remove the template.
- To display data in the
home
template, we will create a helper function that will return a simple string as follows:Template.home.helpers({ exampleHelper: function(){ return 'This text came from a helper with some <strong>HTML</strong>.'; } });
- Now if we go to our
home.html
file, add the{{exampleHelper}}
helper after the{{markdown}}
block helper, and save the file, we will see the string appearing in our browser, but we will notice that the HTML is escaped. - To make Meteor render the HTML correctly, we can simply replace the double curly braces with triple curly braces, as shown in the following line of code, and Blaze won't let the HTML escape:
{{{exampleHelper}}}
- Additionally, we can return unescaped HTML using double curly braces, but we need to return the string passed through the
SpaceBars.SafeString
function, as shown in the following example:Template.home.helpers({ exampleHelper: function(){ return new Spacebars.SafeString('This text came from a helper with some <strong>HTML</strong>.'); } });
推薦閱讀
- 零基礎學C++程序設計
- Python數據分析基礎
- PyTorch自動駕駛視覺感知算法實戰
- Python網絡爬蟲從入門到實踐(第2版)
- 面向STEM的Scratch創新課程
- Mastering Python Networking
- MATLAB 2020從入門到精通
- C語言程序設計習題與實驗指導
- OpenCV 3 Blueprints
- Deep Learning with R Cookbook
- Julia數據科學應用
- 大學計算機應用基礎(Windows 7+Office 2010)(IC3)
- 計算機應用基礎案例教程(第二版)
- HTML5+CSS+JavaScript深入學習實錄
- IBM DB2 9.7 Advanced Application Developer Cookbook