`
橙臣1314
  • 浏览: 6692 次
社区版块
存档分类
最新评论

Handlebars模板使用

 
阅读更多
Handlebars是 JavaScript 一个语义模板库,通过对view和data的分离来快速构建Web模板。而在grunt插件库中,有很多插件使用了Handlebars来为前端工程构建网页,比如在vigosmart工程中用到的assemble插件。
assemble: {
                options: {
                    layoutdir: 'include/html/layouts/',
                    partials:'include/html/partials/**/*',
                    data:'include/html/data/*.{json,yml}'
                },
                site: {
                    expand: true,
                    cwd: 'include/html/pages/',
                    src: ['**/*.hbs'],
                    dest: 'public/'
                }
},

以上在grunt配置文件下配置assemble任务,当然这样生成的网页是静态的,我们在工程中一般会针对当前登录的用户信息生成个人网页,即通过取得的后台数据生成相应动态网页,这才是更为普遍的需求情况,所以我们可以写成js代码,例如一个按钮的点击相应函数,会发出网络请求,根据response附带数据利用template再编译出相应网页。
app.get('/archive', function (req, res) {
  Post.getArchive(function (err, posts) {
    if (err) {
      req.flash('error', err); 
      return res.redirect('/');
    }
    res.render('archive', {
      title: '存档',
      posts: posts,
      user: req.session.user,
      success: req.flash('success').toString(),
      error: req.flash('error').toString(),
      helpers: {
        showYear: function(index, options) {
          if ((index == 0) || (posts[index].time.year != posts[index - 1].time.year)) {
            return options.fn(this);
          }
        }
      }
    });
  });
});

以上就是get请求archive,根据返回的response查到archive模板,利用user信息去生成网页返回用户。而
res.render('archiv
后面跟随的son数据会传入archive模板。
分享到:
评论

相关推荐

    handlebars模板引擎php版 让你的模板前后台都能用

    - 编写模板:创建`.hbs`文件,编写Handlebars模板。 - 渲染模板:在PHP代码中实例化Handlebars类,加载模板和数据,然后渲染成HTML。 总的来说,Handlebars模板引擎PHP版提供了一种强大的方式来处理数据和呈现...

    Handlebars.java逻辑简单支持语义扩展的Java模板引擎

    例如,使用 Handlebars,你可以定义助手方法(helper methods)来处理复杂的逻辑,如条件判断、循环等,使得模板代码更易于理解。 2. **模板语法**:Handlebars 使用双大括号 `{{ }}` 来包围变量和表达式。例如,`{...

    grunt-handlebars-precompile:预编译 Handlebars 模板 (*.hbs) 以与运行时库一起使用

    本文将深入探讨"grunt-handlebars-precompile"这个Grunt插件,它是如何帮助我们预编译Handlebars模板并优化运行时性能的。 "grunt-handlebars-precompile"是专门为Handlebars设计的一个Grunt任务插件。Grunt是基于...

    gulp-handlebars-playground:编译 Handlebars 模板并使用 gulp 将它们呈现为 HTML

    **gulp-handlebars-playground** 是一个用于学习和实践如何使用 Gulp 编译 Handlebars 模板,并将这些模板转化为 HTML 文件的项目。这个项目旨在帮助开发者更好地理解这两个工具的结合使用,提升前端构建效率。 **...

    Java模板引擎Handlebars.java.zip

    Handlebars.java 是一个不包含逻辑的,语义的 Java 模板引擎。 Maven:    <groupId>com.github.jknack</groupId>  <artifactId>handlebars  ${handlebars-version}   示例代码: Handlebars handlebars = ...

    Laravel开发-handlebars-l4

    4. 编写模板:在`resources/views`目录下创建Handlebars模板文件,并使用`{{ }}`语法进行数据绑定和逻辑操作。 5. 渲染模板:在控制器中,使用Handlebars门面渲染模板并传递数据。 **Handlebars-L4的实现细节:** ...

    js模版引擎handlebars.js实用教程demo

    与其它模板引擎相比,Handlebars更注重代码的可读性和维护性。 二、基本语法 1. 变量表达式:{{variable}},用于输出数据模型中的变量值。例如,{{name}} 将输出对应数据对象的name属性。 2. 注释:{{! comment }}...

    前端开源库-handlebars-helper-repeat

    在实际开发中,你可以通过npm或yarn安装这个库,然后在你的Handlebars模板中引入并使用。安装命令可能如下: ```bash npm install handlebars-helper-repeat --save # 或者 yarn add handlebars-helper-repeat ``` ...

    handlebars入门教程

    Handlebars 允许开发者使用子模板 helper 来实现模板嵌套模板的功能。例如: ``` {{> subtemplate}} ``` 在上面的例子中,我们使用 `subtemplate` 子模板 helper 来嵌套模板。 调试技巧 Handlebars 提供了多种...

    前端开源库-yeoman-handlebars-engine

    【前端开源库-yeoman-handlebars-engine】是一个用于前端开发的开源工具,它结合了Yeoman生成器和Handlebars模板引擎。Yeoman是构建现代Web应用程序的自动化工具,它可以帮助开发者快速搭建项目结构,自动执行常见...

    Go-raymond-一个Go实现的完整Handlebars(模板系统)

    《Go-raymond:Go语言实现的完整Handlebars模板系统详解》 在软件开发中,模板引擎扮演着重要的角色,它允许开发者将业务逻辑与视图展示分离,提高代码的可维护性和可读性。Handlebars是一种流行的JavaScript模板...

    handlebars_assets-master

    1. **Handlebars 模板语法**:Handlebars 使用双大括号 `{{ }}` 来包裹变量和表达式,支持条件语句(如 `{{#if}}` 和 `{{else}}`)、循环(如 `{{#each}}`)、助手函数调用等。理解这些基本语法是使用 Handlebars 的...

    handlebars_assets:将handlebars.js模板与Rails资产管道一起使用

    想知道为什么漂亮的Rails 3.1资产管道简化了除Handlebars模板之外的所有JavaScript? 像其他JavaScript一样对Handlebars模板进行编译,压缩和缓存不是很好吗? 是的,我也是。 这就是为什么我写了handlebars_...

    前端开源库-handlebars-delimiters

    总之,`handlebars-delimiters` 提供了对Handlebars模板引擎定界符的自定义能力,增强了代码的可读性和项目的一致性。通过灵活地调整模板标记,开发者可以更好地适应项目需求,提高开发效率。如果你在前端项目中使用...

    handlebars_assets, 在 Rails 资产管道中使用 handlebars.js 模板.zip

    handlebars_assets, 在 Rails 资产管道中使用 handlebars.js 模板 在资产管道和/或者链轮上使用 handlebars.js-模板你的handlebars.js 模板是否用 script 标记搞乱了 Rails 视图? 想知道为什么优秀的Rails 3.1资产...

    handlebars官方例子及源代码

    Handlebars设计的目标是提供一种易于理解和使用的模板语言,同时保持与HTML的清晰分离。它是一种编译时的模板引擎,这意味着在运行时不会进行大量的字符串拼接,从而提高了性能。Handlebars基于Mustache模板语言,但...

    EntityFrameworkCore.Scaffolding.Handlebars:使用把手模板的脚手架EF核心模型

    使用Handlebars模板的脚手架EF Core模型。 在使用脚手架工具生成模型时,使用编译模板。 EF核心社区立场 查看带有此框架的情节,该框架用于带有Handlebars模板的脚手架实体。 可以在此GitHub存储找到该集的演示。 ...

    JavaScript页面模板库Handlebars.zip

    Handlebars.js 是一个 JavaScript 的页面模板库 标签:Handlebars

    前端项目-requirejs-handlebars.zip

    RequireJS的插件机制则允许开发者扩展其功能,比如加载特定类型的模块,例如在这个项目中加载和处理Handlebars模板。 【标签】"前端项目"指明了这个压缩包内容的核心是关于前端开发的实践。前端项目通常包括HTML、...

Global site tag (gtag.js) - Google Analytics