mustache | 易学教程

how can I render this JSON use mustache.js without loop

阅读更多关于 how can I render this JSON use mustache.js without loop

问题 here is the JSON: var data = [ { "event": { "name": "txt1", "data": "2011-01-02", "address": "Guangzhou Tianhe Mall" } }, { "event": { "name": "txt2", "data": "2011-01-02", "address": "Guangzhou Tianhe Mall" } }, { "event": { "name": "txt3", "data": "2011-01-02", "address": "Guangzhou Tianhe Mall" } } ]; and my mustache template is: {{#event}} <div> <h2>{{name}}</h2> <span>on {{data}}</span> <p>{{address}}</p> </div> {{/event} so the template code above don not work.What I do now is make a

How do i capitalize a variable in mustache

阅读更多关于 How do i capitalize a variable in mustache

问题 I have this variable in my mustache template called type, i want to capitalise the value of type using title case, is this possible ? taking into consideration that type is not what is displayed on the web page, it stores a value. {{type}} 回答1: You can wrap it in a span and use CSS. CSS .capitalize { text-transform: capitalize; } Template <span class="capitalize">{{type}}</span> 来源： https://stackoverflow.com/questions/32656158/how-do-i-capitalize-a-variable-in-mustache

Using Mustache.js to Embed Raw JSON

阅读更多关于 Using Mustache.js to Embed Raw JSON

问题 I am using mustache on the command line to embed a JSON object inside of <script> tags within an HTML object. cat sampleData.json | mustache - man_report.mustache > output.html Sample data looks like this: {"report_type":"total_by_age_group", "data":[{"age_group":"Age 41 - 65","percent":41.04}, {"age_group":"Age Over 66","percent":19.11}, {"age_group":"Age < 18 Or Invalid Birth Date","percent":0.00}, {"age_group":"Age 18 - 25","percent":8.03}, {"age_group":"Age 26 - 40","percent":31.82}]}

Mustache (or Handlebars) iterating over two lists

阅读更多关于 Mustache (or Handlebars) iterating over two lists

问题 I have two arrays: var content = { "girls": ["Maria", "Angela", "Bianca"], "digits": ["21.143.191.2", "123.456.78.90", "971.6.17.18.1"] }; and a template: <script id="template" type="text/template"> <ul> <li><a href="{{digits}}">{{girls}}</a></li> </ul> </script> I'd like the end result to be: <ul> <li><a href="21.143.191.2">Maria</a></li> <li><a href="123.456.78.90">Angela</a></li> <li><a href="971.6.17.18.1">Bianca</a></li> </ul> I've tried block mustaches like {{#girls}} {{.}} {{/girls}}

Mustache js takes parent's object scope when none is found in the current one

阅读更多关于 Mustache js takes parent's object scope when none is found in the current one

问题 According to the mustache RFC A {{name}} tag in a basic template will try to find the name key in the current context. If there is no name key, nothing will be rendered. I therefore expected this: var template = '{{#anArray}}{{aString}}{{/anArray}}'; var json = { "aString":"ABC", "anArray": [1,{"aString":"DEF"}] }; To give me once rendered: "DEF" However mustache.js looks for values in the parent's scope. Which gives me "ABCDEF" Do the context actually means including all the parents scopes ?

Mustache.js escaping “/”

阅读更多关于 Mustache.js escaping “/”

问题 I have a simple JSON file as shown below: { "products": [ { "title": "United Colors of Benetton Men's Shirt", "description": "Cool, breezy and charming – this solid green shirt from United Colors of Benetton is born on the beach. Effortlessly classy, this full sleeved shirt is perfect when worn with faded blue jeans and a pair of shades for a weekend get-together.", "quantity": "10", "cost": "3.00", "brand": "United", "image": "catalog/images/img2.jpg", "category": "1", "popularity": "100" }

Mustache Template doesn't render inside table tbody

阅读更多关于 Mustache Template doesn't render inside table tbody

问题 Why is that the same JSON object code generates the output with ul elements, but not with a table tag. I have my Mustache template like: <div id="template-ul"> <h3>{{name}}</h3> <ul> {{#students}} <li>{{name}} - {{age}}</li> {{/students}} </ul> </div> <div id="template-table"> <table> <thead> <th>Name</th> <th>Age</th> </thead> <tbody> {{#students}} <tr> <td>{{name}}</td> <td>{{age}}</td> </tr> {{/students}} </tbody> </table> </div> Here is the javascript code: var testing = { "name" :

Mustache doesn't Evaluate {{}} inside function

阅读更多关于 Mustache doesn't Evaluate {{}} inside function

问题 I am trying to format JS Date () object with moment.js with mustache, however mustache doesn't pass evaluated value to function. In backbone view: render: function () { var user = this.user.toJSON (); //model _.extend (user, {formatLastLoginAt: this.formatLastLoginAt}); var rendered = mustache.render (template, user); this.$el.html (rendered); return this; }, formatLastLoginAt: function () { return function (lastLoginAt) { return moment (lastLoginAt).format ('Do MMMM YYYY'); } } user object

Loading mustache using requirejs

阅读更多关于 Loading mustache using requirejs

问题 I would like to load and use mustache by requirejs. Maybe this question has already asked: AMD Module Loading Error with Mustache using RequireJS Anyway I am trying to figure out how can I fix my code: main.js require.config({ paths: { jquery: 'libs/jquery/jquery', underscore: 'libs/underscore/underscore-min', backbone: 'libs/backbone/backbone-optamd3-min', mustache: "libs/mustache/mustache" } }); require([ 'views/app' ], function(AppView){ var app_view = new AppView; }); app.js define([

Mustache 使用心得总结

阅读更多关于 Mustache 使用心得总结

转自：https://www.cnblogs.com/yelongsan/p/6343315.html 前言：之前的一个项目里面就有用到这个前台的渲染模版，当时挺忙的也没时间抽空总结一下，刚好上周项目里又用到这个轻量型的渲染模版，真心感觉很好用，因此就总结一下使用心得，算是一个入门级别的指引吧。 1. Mustache 概述 Mustache是基于 JavaScript 实现的模版引擎，类似于 jQuery Template，但是这个模版更加的轻量级，语法更加的简单易用，很容易上手。 2. Mustache 具体的使用下面就具体讲一下Mustache的使用。在开始讲之前，需要先从 Git hub上获取相关的mustache.js文件，获取文件之后，新建一个解决方案，目录如下：然后就开始具体的使用，首先需要在页面的head标签内引用Jquery.js 和Mustache.js两个脚本文件，主要有以下几个方面（以下演示的方法均在head标签中的script代码块中）： 2.1 简单的对象绑定展示 l 代码示例： [javascript] view plain copy $( function () { var user = { name: "Olive", age: 23, sex: "girl" }; var template = "My name is {{name}} ,I