Подтвердить что ты не робот

Как я могу заставить нефрит носить усы?

Это мой jade figurine:

section#entry-review-template.template(data-class='entry-review')
  table
    thead
      tr
        th='Date'
        th='Title'
        th
    tbody

Когда я начинаю добавлять mustache к нему, я чувствую, что он начинает терять свою обычную грацию, так как теперь она становится очень придирчивой к любому поры в ее лице.

  {{^entries}}
  h1='No Posts'
  div='There are no blog posts to review.'
  {{/entries}}

Однако, когда я пытаюсь добавить последний кусочек усов, к ее телу на этот раз, она начинает жаловаться, и она либо ломается, либо не хочет помогать, либо просто создает беспорядок.

{{#entries}}
  tr
    td='{{date}}'
    td='{{title}}'
    td
      a.remove-entry
 {{/entries}}

Результат:

{{^entries}}
<h1>No Posts</h1><div>There are no blog posts to review.</div>{{/entries}}
{{#entries}}
<table><thead><tr><th>Date</th><th>Title</th><th></th></tr></thead><tbody></tbody></table>{{date}}{{title}}<a class="remove-entry"></a>{{/entries}}

Я не могу заставить jade правильно выводить свой текст с усами.

Это приложение node.js, которое использует jade для шаблонирования моих просмотров на стороне сервера, я не передаю никакие модели ни одному из моих представлений (такой тяжелый подъем я оставляю на стороне клиента), но мне все равно нужно делать кучу inclue partial повсюду. И у меня много нефрита. И я вроде люблю нефрит. Я не хочу ее отпускать.

Теперь я хочу реализовать очень простые шаблоны усов на стороне клиента, и я хотел бы, чтобы они были встроенными в мои представления.

Конечно, я мог бы обойти это, и иметь их в тегах script или визуализировать их с помощью другого механизма просмотра (теперь, когда я думаю об этом, он даже не чувствует себя легко или просто) но тогда мне пришлось бы писать raw html для них, и я вроде хотел бы смешивать лучшее из обоих миров.

  • Неужели я сумасшедший даже для того, чтобы пытаться?
  • Как я могу сказать нефрит, это просто игра и заставить ее игнорировать мой {{#must}} {{/ache}}?
  • Может ли нефрит сказать каким-то образом игнорировать пробелы?
  • Какие другие варианты, по вашему мнению, я должен учитывать?

Я действительно хочу, чтобы нефрит носил усы. Я знаю его странно, но он меня включит.

Обновление:

Я просто попробовал использовать |, документированный здесь, но даже самый простой

section#entry-review-template.template(data-class='entry-review')
  table
    thead
      tr
        th='Date'
        th='Title'
        th
    tbody
      | {{#entries}}
      | {{/entries}}

заканчивается вывод:

{{#entries}}
{{/entries}}
<table><thead><tr><th>Date</th><th>Title</th><th></th></tr></thead><tbody></tbody></table><h1></h1>
4b9b3361

Ответ 1

Решение: jade Комментарии HTML

  // {{#entries}}
  tr.entry-row(data-id='{{_id}}')
    td='{{date}}'
    td='{{title}}'
    td
      a.edit(title='Edit')='Edit'
      a.remove(title='Delete')
  // {{/entries}}

работает как шарм. вы можете удалить комментарии после этого, но это, по крайней мере, делает трюк.

Ответ 2

Определим некоторые смесители Jade.

mixin if(name)
  != '{{#' + name + '}}'
  block
  != '{{/' + name + '}}'

mixin unless(name)
  != '{{^' + name + '}}'
  block
  != '{{/' + name + '}}'

mixin each(name)
  != '{{#' + name + '}}'
  block
  != '{{/' + name + '}}'

Используйте их свободно в шаблоне Jade:

section#entry-review-template.template(data-class='entry-review')
  +unless('entries')
    h1='No Posts'
    div='There are no blog posts to review.'
  table
    thead
      tr
        th='Date'
        th='Title'
        th
    tbody
      +each('entries')
        tr
          td='{{date}}'
          td='{{title}}'
          td
            a.remove-entry

Создается красивый усы-HTML.

<section id="entry-review-template" data-class="entry-review" class="template">{{^entries}}
  <h1>No Posts</h1>
  <div>There are no blog posts to review.</div>{{/entries}}
  <table>
    <thead>
      <tr>
        <th>Date</th>
        <th>Title</th>
        <th></th>
      </tr>
    </thead>
    <tbody>{{#entries}}
      <tr>
        <td>{{date}}</td>
        <td>{{title}}</td>
        <td><a class="remove-entry"></a></td>
      </tr>{{/entries}}
    </tbody>
  </table>
</section>

Ответ 3

Хорошо, так что это может быть слишком поздно, чтобы быть полезным, и уже есть принятый ответ (там, где BTW я не совсем понял, что "может удалить комментарии", действительно означало там). Тем не менее, я думал, что это может быть полезно для всех в будущей работе, поэтому вот что я нашел до сих пор.

Взяли небольшие фрагменты из вашего кода выше и поместили их в пример, используя тот же простой синтаксис "текстового вывода", который, по-видимому, дал вам странный беспорядочный вывод:

section#entry-review-template.template(data-class='entry-review')
  table
    thead
      tr
        th Date
        th Title
        th
    tbody
      | {{#entries}}
      tr
        td {{date}}
        td {{title}}
        td
          a.remove-entry
      | {{/entries}}

Поместите его в поле редактирования на реальном сайте Jade (http://naltatis.github.com/jade-syntax-docs) и получим результат от Jade как:

<section id="entry-review-template" data-class="entry-review" class="template">
  <table>
    <thead>
      <tr>
        <th>Date</th>
        <th>Title</th>
        <th></th>
      </tr>
    </thead>
    <tbody>{{#entries}}
      <tr>
        <td>{{date}}</td>
        <td>{{title}}</td>
        <td><a class="remove-entry"></a></td>
      </tr>{{/entries}}
    </tbody>
  </table>
</section>

Затем он попробовал это на сайте TryHandlebars (http://tryhandlebarsjs.com) со следующими данными:

{ "entries" :
  [
   { "date" : "Jan 2, 2010", title: "ABCDEF" },
   { "date" : "Nov 15, 2012", title: "UVWXYZ" }
  ]
}

И он выполнен правильно со следующим выходом:

<section id="entry-review-template" data-class="entry-review" class="template">
  <table>
    <thead>
      <tr>
        <th>Date</th>
        <th>Title</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>Jan 2, 2010</td>
        <td>ABCDEF</td>
        <td><a class="remove-entry"></a></td>
      </tr>
      <tr>
        <td>Nov 15, 2012</td>
        <td>UVWXYZ</td>
        <td><a class="remove-entry"></a></td>
      </tr>
    </tbody>
  </table>
</section>

Я не знаю, делаю ли я что-то отличное от того, что вы пытались, но кажется (по крайней мере, на поверхности), что можно вручную создавать шаблоны Mustache/Handlebars из шаблонов Jade без конфликтов. Там могут быть конфликты с более сложными шаблонами, но я их не нашел.

Я уже давно занимался этой идеей, и я уже много рылся. Однако моим главным драйвером были то, что мне нравились простые "логические" логические конструкции Mustache/Handlebars и прекрасное сокращение детализации Haml/Jade, и мне нужна комбинация. С этой целью кажется, что лучшим вариантом может быть Hamlbars или даже лучше EmblemJS, с которым я экспериментирую.

Ответ 4

Emblem.js может быть альтернативой подходу Jade/Mustache, поскольку, похоже, он делает что-то очень похожее. Однако для этого требуется Ember.js.