Blaze是Meteor 软件包用于构建现场反应模板。
Render方法

这种方法被用于绘制模板到DOM。首先，我们将创建 myNewTemplate 之后渲染。 我们增加 myContainer 这将用来作为父元素的容器，所以render方法知道在何处呈现我们的模板。

meteorApp/client/app.html

<head>

   <title>meteorApp</title>

</head>

<body>

   <div id = "myContainer">

   </div>

</body>

<template name = "myNewTemplate">

   <p>Text from my new template...</p>

</template> 

下一步，我们将创建渲染功能这将需要两个参数。第一个是将要渲染的模板，第二个是，我们上面提到的父元素。

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

<head>

   <title>meteorApp</title>

</head>

<body>

   <div id = "myContainer">

   </div>

</body>

<template name = "myNewTemplate">

   <p>Text from my new template...</p>

</template> 

我们可以在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

<head>

   <title>meteorApp</title>

</head>

<body>

   <div id = "myContainer">

   </div>

</body>

<template name = "myNewTemplate">

   <p>Text from my new template...</p>

</template> 

在这个例子中，我们将在三秒钟后移除模板。请注意，我们使用 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。

Meteor Blaze的更多相关文章

  1. Using View and Data API with Meteor

    By Daniel Du I have been studying Meteor these days, and find that Meteor is really a mind-blowing f ...

  2. 示例开发过程记录：meteor,react,apollo

    本示例记录一个开发过程: 1)参考 Meteor React TUTORIAL教程 https://www.meteor.com/tutorials/react/creating-an-app 2). ...

  3. 网站开发只需数小时？Meteor 说这才是未来

    原文: http://www.geekpark.net/topics/211573/ 那个想要挑战过去数十年沿用至今的网站开发模式的新势力来了. Meteor 是从 YC 孵化而出的现代网站开发平台, ...

  4. 【译】Meteor 新手教程：在排行榜上添加新特性

    原文:http://danneu.com/posts/6-meteor-tutorial-for-fellow-noobs-adding-features-to-the-leaderboard-dem ...

  5. POJ 3669 Meteor Shower【BFS】

    POJ 3669 去看流星雨,不料流星掉下来会砸毁上下左右中五个点.每个流星掉下的位置和时间都不同,求能否活命,如果能活命,最短的逃跑时间是多少? 思路:对流星雨排序,然后将地图的每个点的值设为该点最 ...

  6. 如何在Meteor中使用npm模块？

    首先,请在AtmosphereJs上搜索有无相关的封装包.尽量采用已有的封装包,而不是自己封装. 有两种方法在项目中使用来自npm的模块. 封装为Meteor包并在项目中添加包.使用meteor cr ...

  7. windows下Meteor+AngularJS开发的坑

    有复杂的地方我再开贴记录,这里只记录容易解决的坑. 1. windows下手工增加smart package.直接将下载下来的包扔到meteor package中.记得将文件夹名字改得和smart.j ...

  8. Meteor + node-imap(nodejs) + mailparser(nodejs) 实现完整收发邮件

    版本信息: Meteor:windows MIS安装  0.6.4 node-imap:npm指定的0.8.0版,不是默认的0.7.x版. mailparser:npm安装0.3.6 以下是记录踩到的 ...

  9. 手工给Meteor增加smart package的方法

    windows下无法装mrt(Meteor的包管理工具).不过还好smart package本身也就只是一个文件夹而已,不需要在Meteor中注册什么东西.所以直接把smart package扔到me ...

随机推荐

  1. k8s集群部署之环境介绍与etcd数据库集群部署

    角色 IP 组件 配置 master-1 192.168.10.11 kube-apiserver kube-controller-manager kube-scheduler etcd 2c 2g ...

  2. python基础一day3 字符串

    对字符串进行的任何操作都是形成新的字符串. 切片顾头不顾尾 倒着取: 因为顾头不顾尾,所以4要取到 当步长省略时,可以同时省略最后一个冒号 写0时,取不到,什么都不写,可以取到 倒着取出全部的值,两种 ...

  3. C-基础：函数返回局部变量

    一般的来说,函数是可以返回局部变量的. 局部变量的作用域只在函数内部,在函数返回后,局部变量的内存已经释放了.因此,如果函数返回的是局部变量的值,不涉及地址,程序不会出错.但是如果返回的是局部变量的地 ...

  4. 1.入手树莓派之linux环境搭建

    最近刚刚买了一款 树莓派3代B型 raspberrypi 板载蓝牙和WIFI 英国版本,没玩过,觉得很好奇,生怕记性不好哈,把自己玩的过程记录一下,以备不时之需: 需要材料: 1) 树莓派: 2)sd ...

  5. 暑假集训 || 区间DP

    区间DP 经典石子合并问题V1    复杂度 On3 int a[SZ], sum[SZ], f[SZ][SZ]; int main() { int n; scanf("%d", ...

  6. ps---图层，移动工具

    1.移动图层从一个文件到另一个文件相当于复制,如果俩文件大小相同,开始移动后,按下shift键,可保持原来位置.若不相同,拖拽后,按shift,则会自动居中.如果目标文档包含选区,会到选区的中央. 2 ...

  7. 在ubuntu16上搭建rabbitMQ环境

    在ubuntu16上搭建rabbitMQ环境 安装rabbitMQ apt-cache pkgnames | grep rabbitmq apt-get install rabbitmq-server ...

  8. Java 多线程执行

    背景: 如果一个任务由多个子任务组成,子任务全部执行完成后然后由主线程对所有子任务结果进行封装,可以采用如下几种方式: 1.基于Guava ListenableFuture 进行: 2.基于Futur ...

  9. POJ 3621 Sightseeing Cows （最优比率环 01分数划分）

    题意: 给定L个点, P条边的有向图, 每个点有一个价值, 但只在第一经过获得, 每条边有一个花费, 每次经过都要付出这个花费, 在图中找出一个环, 使得价值之和/花费之和 最大 分析: 这道题其实并 ...

  10. LeetCode02-两数相加

    ''' 给出两个 非空 的链表用来表示两个非负的整数.其中,它们各自的位数是按照 逆序 的方式存储的,并且它们的每个节点只能存储 一位 数字. 如果,我们将这两个数相加起来,则会返回一个新的链表来表示 ...