Question

我正在尝试将一些json加载到jQuery tmpl。

$(document).ready(function() {

    $.getJSON("http://stefairclough.com/jsontest/json.json",
            function(data){
                $("#news_articles").empty();
                $("#news_template").tmpl( data ).appendTo("#news_articles");
            })
            .error(function(xhr) {
                    console.log(xhr)
            });             
});

json位于http://stefairclough.com/jsontest/json.js

我似乎无法弄清楚为什么它不起作用。

Answer 1

你的json测试文件有一个尾随;删除

      $scope.today = function() {
      $scope.dt = new Date();
      };
      $scope.today();
      $scope.clear = function () {
         $scope.dt = null;
      };

Answer 2

将您的JS文件放在脚本模板上方

1

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="jquery.tmpl.js"></script>

2

<script id="news_template" type="text/x-jquery-tmpl">
        <div class="news_item">
            <h3>${Headline}</h3>
            <p>Source: <a href="${Url}" target="_blank">${Url}</a>
        </div>
    </script>

然后

$（document）.ready（function（）{

    $.getJSON("http://stefairclough.com/jsontest/json.js",
            function(data){
                $("#news_articles").empty();
                $("#news_template").tmpl( data ).appendTo("#news_articles");
            })
            .error(function(xhr) {
                    console.log(xhr)
            });             
});
</script>

Answer 3

似乎您的XHR请求失败。尝试使用您的JSON文件提供JSON标头。尝试重命名您的文件：

http://stefairclough.com/jsontest/json.json

Answer 4

您的JSON似乎不是有效的JSON。

请尝试使用以下内容来抓取您的JSON：type-aligned sequences

jQuery getJSON数据没有加载到tmpl中

4 个答案: