« Mustache » : différence entre les versions

De Banane Atomic
Aller à la navigationAller à la recherche
Ligne 4 : Ligne 4 :
* [https://github.com/janl/mustache.js/ Doc]
* [https://github.com/janl/mustache.js/ Doc]


= Template =
= [https://github.com/janl/mustache.js/#include-templates Include template]=
<kode lang='html'>
<kode lang='html'>
<script type="x-tmpl-mustache" id="template">
<script id="template" type="x-tmpl-mustache">
    <table>
Hello {{ name }}!
        <thead>
            <tr>
                <th>Id</th>
                <th>State</th>
                <th>Assigned to</th>
            </tr>
        </thead>
        <tbody>
            {{#.}}
            <tr>
                <td><a href="https://dev.azure.com/msc-dev/Pricing/_workitems/edit/{{id}}">{{id}}</a></td>
                <td>{{fields.System_Title}}</td>
                <td>{{fields.System_State}}</td>
                <td>{{fields.System_AssignedTo.displayName}}</td>
            </tr>
            {{/.}}
        </tbody>
    </table>
</script>
</script>
<script>
<script>
$(() => {
$(() => {
     const template = $("#template").html();
     const template = $("#template").html();
     const rendered = Mustache.render(template, json);
     const rendered = Mustache.render(template, { name: 'Nico' });
});
});
</script>
</script>

Version du 28 janvier 2021 à 17:27

Links

Include template

Html.svg
<script id="template" type="x-tmpl-mustache">
Hello {{ name }}!
</script>
<script>
$(() => {
    const template = $("#template").html();
    const rendered = Mustache.render(template, { name: 'Nico' });
});
</script>

Doesn't handle dots in property name

Js.svg
// a solution could be to replace the dots in property names (it uses lodash)
function replaceDotWithUnderscore(obj) {
    _.forOwn(obj, (value, key) => {
        if (_.includes(key, '.')) {
            const cleanKey = _.replace(key, /\./g, '_');
            obj[cleanKey] = value;
            delete obj[key];
        }

        // recursive call if the value is an object or an array
        if (_.isObject(value)) {
            return replaceDotWithUnderscore(value);
        }
    });
    return obj;
}