Kontext ist nicht für Lenker übergeben

Ich benutze Lenker Vorlage. Ich bin über ein seltsames Problem gestolpert. Der folgende Code übergibt den Kontext nicht an die Vorlage für kompilierte Lenker, wenn diese im Browser verwendet wird, aber seltsam ist, dass derselbe Code in jsfiddle gut funktioniert! https://jsfiddle.net/5pnfrjwa/Kontext ist nicht für Lenker übergeben

Hier ist mein Code

<!DOCTYPE html> 
<html> 

    <head> 
    <title>Page Title</title> 
    </head> 

    <body> 
    {{> navbar this }} 

    <div id="render_here"> 
     first 
    </div> 

    <div id="render_here_again"> 
     second 
    </div> 

    <script id="first-template" type="text/x-handlebars-template"> 
     <div> 
     <div> Inside first template</div> 
     <h4 style="color:green">title1 :{{title1}}</h4> 
     <h4 style="color:blue">body1 :{{body1}}</h4> 
     <h4 style="color:blue">context : {{context}}</h4> 
     </div> 
    </script> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.4/handlebars.js"></script> 
    <script> 
     $(document).ready(function() { 

     var source = $("#first-template").html(); 
     var template = Handlebars.compile(source); 


     var context 
      // = "test 1" 
      = { 
      title1: "hello", 
      body1: "body1" 
      } 

     var el_html = template(context); 

     console.log("*** This is source     : " + source); 
     console.log("*** This is template    : " + template); 
     console.log("*** This is template(context)  : " + el_html) 
     console.log(" data is : " + context.title1) 

     // $(document.body).append(el_html); 
     // $("#render_here").html(el_html); 
     // $("#render_here_again").html(el_html); 
     // document.getElementById('render_here_again').innerHTML = template(context); 
     $("#render_here_again").html(el_html) 

     }); 

    </script> 
    </body> 

</html>

I Quelle zu trösten angezeigt und hier der Ausgang

*** This is source     : 
     <div> 
     <div> Inside first template</div> 
     <h4 style="color:green">title1 :</h4> 
     <h4 style="color:blue">body1 :</h4> 
     <h4 style="color:blue">context : </h4> 
     </div>

Wenn gleiche auf jsfiddle angezeigt wird, seine wie folgt:

*** This is source     : 
     <div> 
     <div> Inside first template</div> 
     <h4 style="color:green">title1 :{{title1}}</h4> 
     <h4 style="color:blue">body1 :{{body1}}</h4> 
     <h4 style="color:blue">context : {{context}}</h4> 
     </div>

Es scheint, Variable Name kommt in der Quelle in doppelten geschweiften Klammern auf jsfiddle, aber es kommt nicht auf meinem lokalen Rechner. Irgendeine Idee, warum sich das im Browser und bei jsfiddle anders verhält. Ich habe es mit Chrome und Mozilla versucht, aber das gleiche Problem mit beiden konfrontiert. Ich benutze nodejs und expressjs auf der Serverseite.

Einen bearbeiten Es scheint, ich könnte das Problem identifiziert haben, aber ich bin immer noch auf der Suche nach einer Lösung. Dies passiert, wenn ich diese Seiten von Express 4 Server rendere. Wenn ich einfache HTML-Datei mit dem obigen Code öffne, funktioniert es gut.

Quelle

2017-09-17 Conquistador

Versuchen Sie, aus geschweiften Klammern mit einem umgekehrten Schrägstrich zu entkommen, um das Rendern auf der Serverseite zu vermeiden.

<script id="first-template" type="text/x-handlebars-template"> 
    <div> 
    <div> Inside first template</div> 
    <h4 style="color:green">title1 :\{{title1}}</h4> 
    <h4 style="color:blue">body1 :\{{body1}}</h4> 
    <h4 style="color:blue">context : \{{context}}</h4> 
    </div> 
</script>

Quelle

2017-09-17 18:07:03

Versucht dies und seine Arbeit. Danke vielmals. Ich sah einige der Beispiele, wo es verwendet wurde, ohne zu entkommen und es funktionierte gut. Gibt es einen anderen Weg? – Conquistador

Es gibt viele Lösungen, werfen Sie einen Blick auf ein Thema über [Mustache Vorlagen] (https://stackoverflow.com/questions/13944623/escape-double-brackets-in-mustache-template-templating-a-template- in-n): z RegisterHelper/Tags-Methode oder Ersetzen von Zeichen auf der Serverseite. –

Ich wundere mich, wenn ich diesen Teil des Codes auf dem Server vorkompilieren und während der Laufzeit den Inhalt nur an den vorkompilierten Handlebarsjs-Code übergeben, sollte es funktionieren. Ich werde das heute Abend überprüfen und werde es euch wissen lassen. – Conquistador

Kontext ist nicht für Lenker übergeben

Antwort

Verwandte Themen