javascript模版工具 kino.razor

码农软件 · 软件分类 · 模板引擎 · 2019-08-23 22:14:18

授权协议: GPL
开发语言: JavaScript
操作系统: 跨平台
软件首页: https://github.com/kinogam/kino.razor
软件文档: http://www.kinogam.com/?p=575
官方下载: https://github.com/kinogam/kino.razor

软件介绍

kino.razor-一个javascript模版工具。简单易用，而且入门成本极低，对于熟悉asp.net mvc的razor模版的程序员更是0学习成本。

如何使用？

web页面使用时，只需要增加script标签引入:

<script src="kino.razor.js"></script>

或者压缩版本：

<script src="kino.razor.min.js"></script>

node.js 使用：

    npm install razor

node.js代码引用：

var razor = require("razor");

kino.razor第一个参数是”模版字符串“或者”模版函数“（模版函数后面会解释）

    var str = kino.razor("Hey, @name!", { name: 'kino' }); //result: "Hey, kino!"

当只传递了模版字符串时，结果将返回一个模版函数：

    var r = kino.razor("hello!@name"); //type of r is function

模版会自动把缺失的变量置空（这个是某些模版没有考虑到的）：

    var templateStr = "Hey, @xxx";

var str = kino.razor(templateStr, {});

 //result: "Hey, "

多次重复使用时，建议将模版函数保持起来，使用时，再把模版函数和数据当参数传入，以提高性能

    var tf = kino.razor("hello!@name");

var str = kino.razor(tf, { name: 'kino' });

//result: "hello!kino"

以下是一些模版用法

脚本块

    var templateStr = "@{var fname='kino';}this is @fname @lname";

var str = kino.razor(templateStr, {lname:'jack'});

 //result: "this is kino jack"

使用条件判断

    var templateStr = "@if(1==0){<span>if you see this word,your test is failed</span>}";

 var str = kino.razor(templateStr, {});

 //result: ""

循环

    var templateStr = "@for(var i = 0; i < 3; i++){<span>@i</span>}";

var str = kino.razor(templateStr, {});

//result: "<span>0</span><span>1</span><span>2</span>"  
    templateStr = "@{var i = 3;}@while(i--){<span>@i</span>}";

 str = kino.razor(templateStr, {});

//result: "<span>2</span><span>1</span><span>0</span>"

使用 HtmlHelper.escape函数（可自己扩展kino.razor.HtmlHelper)

    var templateStr = "<input yyy='@Html.escape(test)' xxx=\"@Html.escape(otherAttr)\" />";

var str = kino.razor(templateStr, { test: "kino's test", otherAttr: "\"one more test\"" });

 //result: "<input yyy='kino&#x27;s test' xxx=\"&quot;one more test&quot;\" />"

@@转义为@

    var templateStr = "{@name@@gmail.com}";

var str = kino.razor(templateStr, { name: 'kino' });

//result: '{kino@gmail.com}'

当在asp.net mvc3使用时，可以替换掉@符号，使用其他符号，例如 $ 代替

    kino.razor.use("&");

var str = kino.razor("&name@&email", { name: "kinogam", email: "gmail.com" });

//"kinogam@gmail.com"

    kino.razor.use("$");

var str = kino.razor("$name@$email", { name: "kinogam", email: "gmail.com" });

 //"kinogam@gmail.com"

可以使用 @(name) 这种风格

    var str = kino.razor("Hey, zz@(name)zz!", { name: 'kino' });

 //result: "Hey, zzkinozz!"

当然我希望大家都能把模版放到页面上，以便代码和视图分离，比如：

<script type="text/template" id="temp_hello">
   <div>
       <span>hello @name!</span>
   </div>
</script>

然后读取 document.getElementById(“temp_hello”).innerHTML

PS：假如大家也有玩github的话，欢迎fork我的项目，并pull request，同时有技术问题也可以发送邮件到我的邮箱kinogam@gmail.com,谢谢。

本文地址：https://codercto.com/soft/d/13029.html

码农书籍

大教堂与集市

[美] Eric S. Raymond / 卫剑钒 / 机械工业出版社 / 2014-5 / 59.00元

当代软件技术领域最重要的著作，中文版首次出版！《大教堂与集市》是开源运动的《圣经》，颠覆了传统的软件开发思路，影响了整个软件开发领域。作者Eric S. Raymond是开源运动的旗手、黑客文化第一理论家，他讲述了开源运动中惊心动魄的故事，提出了大量充满智慧的观念和经过检验的知识，给所有软件开发人员带来启迪。本书囊括了作者最著名的“五部曲”，并经过作者的全面更新，增加了大量注释，提高了可读......一起来看看《大教堂与集市》这本书的介绍吧!

码农工具

随机密码生成器

多种字符组合密码

HEX HSV 转换工具

HEX HSV 互换工具