Gạch dưới templating: Không thể chuyển sang làm việc

Question

Tôi không thể nhận được câu lệnh chuyển đổi đơn giản hoạt động trong mẫu gạch dưới của tôi. Nó sử dụng giá trị của một biến được gọi là UserType mà tôi đã kiểm tra bằng cách hiển thị nó với <% = UserType%>.

Mã sắp tới:

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

Bất kỳ giúp nhiều đánh giá cao - nhờ.

Answer 1

Vấn đề là dấu gạch dưới sẽ thêm dấu chấm phẩy khi chuyển mẫu của bạn sang JavaScript. Vì vậy, một đơn giản switch như thế này:

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

trở JavaScript mà trông như thế này:

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

Nhưng một Javascript switch cần phải chứa case báo cáo và một tuyên bố rỗng (tức là ; trong switch(x) { ;) doesn không đủ điều kiện.

Tôi không thể nghĩ ra cách nào lành mạnh xung quanh vấn đề này vì vậy tôi muốn chỉ cần chuyển sang một if và chuyển sang vấn đề thú vị hơn:

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

Bạn cũng có thể tắt nó trong ra ngoài và sử dụng print:

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

nhưng đó là một chút xấu xí (IMHO). Xem chi tiết _.template documentation.

---

Lưu ý rằng dấu chấm phẩy lừa đảo này cũng là lý do tại sao if của bạn phải bao gồm niềng răng trong một mẫu gạch thậm chí nếu Javascript không đòi hỏi họ. Vì vậy, điều này sẽ không làm việc:

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

nhưng điều này sẽ:

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

Cùng áp dụng cho vòng lặp.

Answer 2

Bạn có thể làm:

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

Nó không phải là một "thoải mái" giải pháp, nhưng không phải là sai. Chỉ cần làm việc.