javascript - 每条记录使用 node-json2html 给出单独的 html 表

Question

我正在使用 json 数据创建 html 表，并且我的转换为每条记录提供了一个单独的表。

 var data=[{"name":"aa","mid":"12345","user":"a123","password":"a@123"},{"name":"bb","mid":"2345","user":"b123","password":"b@123"}]
var transform=[
    {"<>":"style","html":"table,th,td {border: 1px solid black;border-collapse: collapse;}th {text-align: left;}"},
    {"<>":"p","html":"Dear client"},
    {"<>":"p","html":"Please find below merchant users passwords are expired. Kindly take necessaray action immediately."},
    {"<>":"table","style":"width:100%","html":[
        {"<>":"tbody","html":[
            {"<>":"tr","html":[
                {"<>":"th","id":"name","html":"Client Name"},
                {"<>":"th","id":"mid","html":"MID Number"},
                {"<>":"th","id":"username","html":"Username"},
                {"<>":"th","id":"password","html":"Current Password"}
            ]},
        {"<>":"tbody","id":"json-body","html":[
            {"<>":"tr","html":[
                {"<>":"td","html":"${name}"},
                {"<>":"td","html":"${mid}"},
                {"<>":"td","html":"${user}"},
                {"<>":"td","html":"${password}"}
            ]},
        ]},
        ]},
    ]},
    {"<>":"p","html":"Thanks & Regards"},
    {"<>":"p","html":"support@aa.com"}
]

如何通过将所有数据放入一个 html 表中来做到这一点？

Answer 1

您可以将数据更改为Object具有键的数据users，然后定义一个新的transform和一个新的内联函数来转换data.users.

ps：我认为第一个tbody应该是thead。

代码如下：

var data = {
    users: [{
        "name": "aa",
        "mid": "12345",
        "user": "a123",
        "password": "a@123"
    }, {
        "name": "bb",
        "mid": "2345",
        "user": "b123",
        "password": "b@123"
    }]
}
var transform2 = [{
    "<>": "tr",
    "html": [{
        "<>": "td",
        "html": "${name}"
    }, {
        "<>": "td",
        "html": "${mid}"
    }, {
        "<>": "td",
        "html": "${user}"
    }, {
        "<>": "td",
        "html": "${password}"
    }]
}];
var transform = [{
    "<>": "style",
    "html": "table,th,td {border: 1px solid black;border-collapse: collapse;}th {text-align: left;}"
}, {
    "<>": "p",
    "html": "Dear client"
}, {
    "<>": "p",
    "html": "Please find below merchant users passwords are expired. Kindly take necessaray action immediately."
}, {
    "<>": "table",
    "style": "width:100%",
    "html": [{
        "<>": "thead",
        "html": [{
            "<>": "tr",
            "html": [{
                "<>": "th",
                "id": "name",
                "html": "Client Name"
            }, {
                "<>": "th",
                "id": "mid",
                "html": "MID Number"
            }, {
                "<>": "th",
                "id": "username",
                "html": "Username"
            }, {
                "<>": "th",
                "id": "password",
                "html": "Current Password"
            }]
        }, {
            "<>": "tbody",
            "id": "json-body",
            "html": function(obj) {
                return (json2html.transform(obj.user, transform2));
            }
        }, ]
    }, ]
}, {
    "<>": "p",
    "html": "Thanks & Regards"
}, {
    "<>": "p",
    "html": "support@aa.com"
}];
var html = json2html.transform(data, transform);

看到这个