Условное утверждение Усы (если/else) не работает

Попытка справиться с Усы ... проблема здесь в том, что условное «if/else» работает не так, как ожидалось. Я проверяю данные, если пользователь является французским ... если они тогда показывают true, иначе show false.Условное утверждение Усы (если/else) не работает

Проблема

Уса полностью игнорирует условные и отображения и истинного и ложного для каждой строки таблицы.

Мой код

Моя разметка

<!-- --> 
<h3>Looping through people</h3> 
<table class="table table-striped"> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>Age</th> 
      <th>Language</th> 
     </tr> 
    </thead> 

    <template id="template2"> 
     {{#users}} 
      <tr> 
       <td>{{name}}</td> 
       <td>{{age}}</td> 
       <td>{{language}}</td> 
       {{#is_french}} 
        <td>True</td> 
       {{/is_french}} 
       {{^is_french}} 
        <td>False</td> 
       {{/is_french}} 
      </tr> 
     {{/users}} 
    </template> 
    <tbody id="table2"></tbody> 
</table> 
<!-- -->

Мой JQuery

$(function(){ 


    /** 
    * conditional data 
    */ 
    template = $('#template2').html(); 
    data = { 
     'users': [{ 
       name: 'John', 
       age: 22, 
       language: 'French', 
       is_french: true, 
      }, 
      { 
       name: 'Billy', 
       age: 33, 
       language: 'Anglaise', 
       is_french: false, 
      }, 
      { 
       name: 'Michael', 
       age: 77, 
       language: 'Cambodian', 
       is_french: false, 
     }] 
    }; 
    $('#table2').html(Mustache.render(template, data)); 


});

Вопрос

Почему здесь/не работает?

EDIT: Вот весь мой документ:

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title></title> 
     <link rel="stylesheet" href="style.css"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.3.0/mustache.js"></script> 
    </head> 
    <body> 

     <div class="container"> 

      <h1 class="text-center">Mustache Examples</h1> 

      <!-- --> 
      <h3>Looping through people</h3> 
      <table class="table table-striped"> 
       <thead> 
        <tr> 
         <th>Name</th> 
         <th>Age</th> 
         <th>Language</th> 
        </tr> 
       </thead> 

       <template id="template2"> 
        {{#users}} 
         <tr> 
          <td>{{name}}</td> 
          <td>{{age}}</td> 
          <td>{{language}}</td> 
          {{#is_french}} 
           <td>True</td> 
          {{/is_french}} 
          {{^is_french}} 
           <td>False</td> 
          {{/is_french}} 
         </tr> 
        {{/users}} 
       </template> 
       <tbody id="table2"></tbody> 
      </table> 
      <!-- --> 

     </div> 


     <script> 

     $(function(){ 

      /** 
      * conditional data 
      */ 
      template = $('#template2').html(); 
      data = { 
       'users': [{ 
         name: 'John', 
         age: 22, 
         language: 'French', 
         is_french: true, 
        }, 
        { 
         name: 'Billy', 
         age: 33, 
         language: 'Anglaise', 
         is_french: false, 
        }, 
        { 
         name: 'Michael', 
         age: 77, 
         language: 'Cambodian', 
         is_french: false, 
       }] 
      }; 
      $('#table2').html(Mustache.render(template, data)); 

     }); 

     </script> 

    </body> 
</html>

источник

2017-02-14 Jethro Hazelhurst

Вы предоставили 'template3', используя' template2' в поле зрения. В 'template2' нет использования' is_french'. – Andrey

Мой плохой! Так жаль, что скопировал неправильный блок! –

Интересно, но код, который вы опубликовали, полностью в порядке, шаблон усы в порядке, и он отображается как предполагается. Должна быть ошибка в другой части кода. Не могли бы вы создать скрипку, где эта проблема воспроизводится? – Andrey

Это проблема использования template тега, который на самом деле HTML5 template tag. Использование хэшей в нем заставляет браузер думать, что это фрагмент документа. Кажется, что вложенный фрагмент документа повреждает шаблон Mustache.

Просто измените его на script тег, как в руководстве для усов.

<script id="template2" type="x-tmpl-mustache"> 
    {{#users}} 
    <tr> 
     <td>{{name}}</td> 
     <td>{{age}}</td> 
     <td>{{language}}</td>        
     {{#is_french}} 
      <td>True</td> 
     {{/is_french}} 
     {{^is_french}} 
      <td>False</td> 
     {{/is_french}} 
    </tr> 
    {{/users}} 
</script>

источник

2017-02-14 12:33:29 Andrey

О, хватит, это здорово! –

Условное утверждение Усы (если/else) не работает

ответ

Смежные вопросы