Meteor Blaze

Blaze是Meteor 軟件包用於構建現場反應模板。

Render方法

---

這種方法被用於繪製模板到DOM。首先，我們將創建 myNewTemplate 之後渲染。 我們增加 myContainer 這將用來作爲父元素的容器，所以render方法知道在何處呈現我們的模板。

meteorApp/client/app.html

 

下一步，我們將創建渲染功能這將需要兩個參數。第一個是將要渲染的模板，第二個是，我們上面提到的父元素。

meteorApp/client/app.js

Meteor.startup(function () {
if(Meteor.isClient) {
var myNewTemplate = Template.myNewTemplate;
var myContainer = document.getElementById('myContainer');
Blaze.render(myNewTemplate, myContainer);
}
});

渲染數據

---

如果需要被動地傳遞一些數據，你可以使用 renderWithData 方法。 HTML和前面的例子完全相同。

meteorApp/client/app.html

 

我們可以在Meteor.renderWithData方法的第二個參數添加數據。其它兩個參數和之前的實例相同，在這個例子中我們的數據將用於記錄一些文本的功能。

meteorApp/client/app.js

Meteor.startup(function () {

if(Meteor.isClient) {
var myNewTemplate = Template.myNewTemplate;

  var myData = function() {
     console.log('Log from the data object...')
  }

  var myContainer = document.getElementById('myContainer');
  Blaze.renderWithData(myNewTemplate, myData, myContainer);

}

});

刪除方法

---

我們可以添加 remove

meteorApp/client/app.html

 

在這個例子中，我們將在三秒鐘後移除模板。請注意，我們使用 Blaze.Remove方法 除去模板。

meteorApp/client/app.js

Meteor.startup(function () {
if(Meteor.isClient) {
var myNewTemplate = Template.myNewTemplate;
var myContainer = document.getElementById('myContainer');
var myRenderedTemplate = Blaze.render(myNewTemplate, myContainer);

  Meteor.setTimeout(function() {
     Blaze.remove(myRenderedTemplate);}, 3000);

}
});

下表顯示了可使用的其他方法。

S.No.

方法與細則

1

Blaze.getData([elementOrView])

用於從渲染元素檢索數據。

2

Blaze.toHTML(templateOrView)

用於渲染模板或視圖字符串。

3

Blaze.toHTMLWithData(templateOrView, data)

用於渲染模板或視圖字符串附加數據。

4

new Blaze.View([name], renderFunction)

用於創建新 Blaze 反應性的DOM部分。 

5

Blaze.currentView

用於獲取當前視圖。

6

Blaze.getView([element])

用於獲取當前視圖。

7

Blaze.With(data, contentFunc)

用於構造呈現一些內容與上下文的視圖。

8

Blaze.If(conditionFunc, contentFunc, [elseFunc])

用於構造呈現一些有條件的內容的視圖。

9

Blaze.Unless(conditionFunc, contentFunc, [elseFunc])

用於構造呈現一些有條件的內容(反轉Blaze.if)的視圖。

10

Blaze.Each(argFunc, contentFunc, [elseFunc])

用於構建爲每個項目呈現 contentFunct 的視圖。

11

new Blaze.Template([viewName], renderFunction)

使用名稱和內容構建新的Blaze視圖。

12

Blaze.isTemplate(value)

如果值是一個模板對象則返回true。