2013-04-11 17 views
13

Ich kann nicht eine einfache Switch-Anweisung in meiner Unterstrich-Vorlage arbeiten. Es verwendet den Wert einer Variablen namens UserType, die ich überprüft habe, indem es mit <% = UserType%> angezeigt wird.Underscore Templating: Kann nicht zur Arbeit wechseln

-Code kommen:

<% switch(UserType) { %> 
    <% case 13: %> 
     <button id="schoolButton" value="schools" class="gridChooser k-textbox">Schools</button> 
    <% case 12: %> 
     <button id="teacherButton" value="teachers" class="gridChooser k-textbox">Teacher</button> 
    <% case 8: %> 
     <button id="classButton" value="classes" class="gridChooser k-textbox">Classes</button> 
     <button id="testButton" value="tests" class="gridChooser k-textbox">Test</button> 
<% } %> 

Jede Hilfe sehr geschätzt - danke.

Antwort

20

Das Problem ist, dass Underscore Semikolon-Terminatoren bei der Konvertierung Ihrer Vorlage in JavaScript hinzufügen wird. So ist eine einfache switch wie folgt aus:

<% switch(x) { %> 
<% case 11: %> 
    <button> 
<% } %> 

wird JavaScript, das wie folgt aussieht:

switch(x) { ; 
case 11: ; 
    // something to output '<button>' goes here 
} ; 

Aber ein JavaScript switch Anforderungen enthalten case Aussagen und eine leere Anweisung (dh die ; in switch(x) { ;) doesn nicht qualifizieren.

mir kein vernünftiger Weg, um dieses Problem denken, so würde ich auf eine if und ziehen weiter, um weitere interessante Probleme wechseln Sie einfach:

<% if(UserType === 13) { %> 
    <button id="schoolButton" value="schools" class="gridChooser k-textbox">Schools</button> 
<% } else if(UserType === 12) { %> 
    <button id="teacherButton" value="teachers" class="gridChooser k-textbox">Teacher</button> 
<% } else if(UserType === 8) { %> 
    <button id="classButton" value="classes" class="gridChooser k-textbox">Classes</button> 
    <button id="testButton" value="tests" class="gridChooser k-textbox">Test</button> 
<% } %> 

Man könnte es auch von innen nach außen und Verwendung drehen print:

<% switch(UserType) { 
    case 13: 
     print('<button id="schoolButton" ...'); 
    ... 
} %> 

aber das ist eine hässliche Bit (IMHO). Einzelheiten finden Sie unter _.template documentation.


Beachten Sie, dass diese Semikolon List ist auch, warum Ihre if s Klammern in einer Unders Vorlage enthalten muss, auch wenn JavaScript nicht benötigt werden. So wird dies nicht funktionieren:

<% if(pancakes) %> 
    <%= pancakes %> 

aber dies wird:

<% if(pancakes) { %> 
    <%= pancakes %> 
<% } %> 

Gleiches gilt für Schleifen gilt.

+0

Wunderbare Antwort. Vielen Dank für die Erklärung, warum die erwartete Lösung nicht funktioniert. –

+0

@DanM: Danke. Ich musste in der kompilierten Version der Vorlage herumkramen, also dachte ich, ich sollte teilen, was ich gefunden habe: Wenn ich es nicht erklären kann, dann verstehe ich es nicht, wenn ich es nicht verstehe, dann tue ich es nicht fühle mich richtig antworten. –

10

können Sie tun:

<% switch(UserType) { case 13: %> 
    <button id="schoolButton" value="schools" class="gridChooser k-textbox">Schools</button> 
    <% break; case 12: %> 
    <button id="teacherButton" value="teachers" class="gridChooser k-textbox">Teacher</button> 
    <% break; case 8: %> 
    <button id="classButton" value="classes" class="gridChooser k-textbox">Classes</button> 
    <button id="testButton" value="tests" class="gridChooser k-textbox">Test</button> 
<% break; } %> 

Es ist kein "komfortabel" Lösung ist, aber weder falsch ist. Funktioniert einfach.

Verwandte Themen