2013-04-11 10 views
13

Non riesco a ottenere una semplice istruzione switch che funzioni nel mio modello di sottolineatura. Sta usando il valore di una variabile denominata UserType che ho verificato esistendo visualizzandola con <% = UserType%>.Modelli di underscore: impossibile passare al lavoro

Codice in arrivo:

<% 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> 
<% } %> 

Qualsiasi aiuto molto apprezzato - grazie.

risposta

20

Il problema è che Underscore aggiungerà i punti e virgola quando si converte il modello in JavaScript. Quindi, un semplice switch come questo:

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

diventa JavaScript che assomiglia a questo:

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

Ma un JavaScript switch deve contenere case dichiarazioni e una dichiarazione vuota (cioè il ; in switch(x) { ;) doesn 'qualificati.

non riesco a pensare a un modo sano di mente intorno a questo problema in modo che avevo appena passare a un if e passare a problemi più interessanti:

<% 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> 
<% } %> 

Si potrebbe anche girare dentro-fuori e l'uso print:

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

ma questo è un po 'brutto (IMHO). Vedi lo _.template documentation per i dettagli.


Si noti che questo punto e virgola inganno è anche il motivo per cui i tuoi if s devono includere le parentesi in un modello di sottolineatura anche se JavaScript non richiede loro. Quindi questo non funzionerà:

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

ma questo sarà:

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

Lo stesso vale per i cicli.

+0

Risposta meravigliosa. Grazie per aver spiegato perché la soluzione prevista non funziona. –

+0

@DanM: Grazie. Ho dovuto andare a scavare nella versione compilata del template, quindi ho pensato che avrei dovuto condividere quello che ho trovato: se non riesco a spiegarlo, allora non lo capisco, se non lo capisco, allora non lo capisco sentire la giusta risposta –

10

si può fare:

<% 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; } %> 

Non è una soluzione di "comodo", ma nessuno dei due è sbagliato. Funziona.