Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

I am using handlebars and it is working fine in development. When I upload to github-pages, The handlebars template still works if i open directly to the page. But if I go to a page in a link, the handlebars loop doesn't work. Here is my code:

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    <script src="../bower_components/handlebars/handlebars.min.js"></script>
</head>
<div id="content-placeholder"></div> 
<script id="some-template" type="text/x-handlebars-template">
  {{#each this}}
    <div class=" col-md-4 col-sm-6 " data-animation-type="fadeIn" data-animation-delay="0.5s" data-animation-duration="2s">
       <div class="item-wrap">
          <figure class="">
             <div class="popup-call">
                <a href="assets/custom/images/blog/01.jpg" class="gallery-item"><i class="flaticon-arrows-4"></i></a>
             </div>
             <img src="{{this.picture.picture.url}}" class="img-responsive" style="height: 200px" alt="img11"/>
             <figcaption>
                <div class="post-header">
                   <h5><a href="blogpost.html">{{this.name}}</a></h5>
                </div>

             </figcaption>
          </figure>
       </div>
    </div>
  {{/each}}
</script>
<script>
    $(document).ready(function(){
      var source   = $("#some-template").html();
      var template = Handlebars.compile(source);
      $.getJSON('https://my-url.com/teams.json', function(data){
        console.log(data);
        $("#content-placeholder").html(template(data));
      });
    });

</script>

I've tried doing it without the document.ready() but that doesn't change anything.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
294 views
Welcome To Ask or Share your Answers For Others

1 Answer

It's fairly clear that the handlebars.js isn't loading, because of the relative path in the script tag:

 <script src="../bower_components/handlebars/handlebars.min.js"></script>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share

548k questions

547k answers

4 comments

86.3k users

...