Question

我想在我的主页面中使用jQuery的get（）方法包含一个外部模板，但我有一个问题。

以下消息显示在Web浏览器的控制台中：

TypeError：模板无效！模板应该是一个“字符串”，但“undefined”作为胡子的第一个参数#grand（模板，视图，局部） - （mustache.min.js：1：9011）

index.html

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body onload="myTemplate()">
    <div id="target">Loading ... </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.2.1/mustache.min.js"></script>
    <script type="text/javascript" src="my-script.js"></script>
</body>
</html>

templates.html

<script id="tpl-1" type="text/html">
    <p>{{ name }} wins {{ calc }} points</p>
</script>

我-的script.js

// my-script.js

function myTemplate() {

    $.get("tpl/templates.html", function(templates) {
        var template = $(templates).filter("#tpl-1").html();

        var data = {
            name: "Guy",
            calc: function () {
            return 8 + 2;
            }
        };

        var rendered = Mustache.render(template, data);
        $('#target').html(rendered);
    });
}

然而，它适用于load（）方法：

// my-script.js

function myTemplate() {

    $("#target").load("tpl/templates.html #tpl-1", function() {
        var template = $("#tpl-1").html();

        var data = {
            name: "Guy",
            calc: function() {
                return 8 + 2;
            }
        };

        var rendered = Mustache.render(template, data);
        $('#target').html(rendered);
    });
}

您是否有想过运行get（）方法？

Answer 1

    $(document).ready(function(){

    function myTemplate() {

    $.get("templates.html", function(templates) {
        var template = $(templates).filter("#tpl-1").html();

        var data = {
            name: "Guy",
            calc: function () {
            return 8 + 2;
            }
        };

        var rendered = Mustache.render(template, data);
        $('#target').html(rendered);
    });
}

$('#target').on('load', myTemplate());

});

mustache.js - 无法使用jQuery get（）方法获取外部模板

1 个答案: