时间戳

首页 > 解决方案 > 如何在 json 中使用 mustache 和单个实体呈现 html 块

javascript - 如何在 json 中使用 mustache 和单个实体呈现 html 块

问题描述

我正在尝试学习 mustache 模板引擎，但我有一个简单的例子，我似乎无法弄清楚......

鉴于这个 json

{  
    "targetPatient": {  
        "address": {  
            "city": "Moore",  
            "country": null,  
            "lines": [  
                "123 Main Street"  
            ],  
            "state": "SC",  
            "zip": "29388"  
        },  
        "communicationList": null,  
        "dateOfBirth": "1970-02-01",  
        "gender": "M",  
        "personName": {  
            "firstName": "Johnny",  
            "lastName": "Smith"  
        }  
    }  
}

我想渲染这个 html

<!DOCTYPE html>
<html lang=""en"">
<head>
    <meta charset=""UTF-8"">
    <title>Title</title>
    
</head>
<body>
<H3>
Johnny Smith
</H3>
</body>
</html>

使用这个模板...

<!DOCTYPE html>
<html lang=""en"">
<head>
    <meta charset=""UTF-8"">
    <title>Title</title>
    
</head>
<body>
<H3>
{{targetPatient.personName.firstName}} {{targetPatient.personName.lastName}}
</H3>
</body>
</html>

真的希望它会那么简单。

呈现这个简单示例的最简单方法是什么。

我正在尝试使用 c# stubble 库进行渲染。这是那个代码...

var template  = GetTemplate();  //get above template
var json = GetJson();           //get above json

//var stubble = new Stubble.Core.Builders.StubbleBuilder().Build();
//var output = stubble.Render(template, json);
var output = Nustache.Core.Render.StringToString(template,json);

var filePath = $@"<user>\Desktop\stubble\{Guid.NewGuid().ToString()}.html";

File.AppendAllText(filePath,output);

这是渲染的...

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    
</head>
<body>
<H3>
 
</H3>
</body>
</html>

这是.net小提琴...

https://dotnetfiddle.net/92BPoa

编辑 - 示例从使用 Stubble 更改为 Nustache，因为它正在使用 dotnetfiddle.net

标签： javascriptc#jsonmustache

解决方案

我发现库需要接收一个 json 对象而不是一个字符串（恰好是 json）作为数据。

var template = GetTemplate();
var json = GetJson();

//var stubble = new Stubble.Core.Builders.StubbleBuilder().Build();
//var output = stubble.Render(template, json);
var jsonResult = Newtonsoft.Json.JsonConvert.DeserializeObject(json);
var output = Nustache.Core.Render.StringToString(template,jsonResult);

var hbtemplate = HandlebarsDotNet.Handlebars.Compile(template);

var output2 = hbtemplate(jsonResult);

推荐阅读