Блог

Я использую JsViews для разработки шаблона. Однако мне интересно, можем ли мы сгруппировать атрибут на основе его строкового значения?

Пример JSON:

 "ItemDetails": [
    {
        "Amount": 2000,
        "Name": "Horror Book",
    },
    {
        "Amount": 3500,
        "Name": "Horror Book",
    },
    {
        "Amount": 1000,
        "Name": "Children Book",
    },
],
  

Текущий код описывает каждый элемент, даже если он имеет то же имя.

 {{for ItemDetails}}
{{if Amount}}
            <row>
                <col>{{>Name}}</col>
                <col>{{>Amount}}</col>
            </row>
{{/if}}
{{/for}}
  

Я хочу, чтобы результат был таким:

Книга ужасов 5500

Детская книга 1000

Теги JsRender /JsViews {{for}} и {{props}} имеют встроенную поддержку сортировки, фильтрации и т.д., но не имеют встроенной функции groupBy. Но вы можете довольно легко создать его, следуя методам, аналогичным сетке с образцом ~total() .

Вот подход, использующий вспомогательные функции:

 <table><tbody>
  {{for ItemDetails sort="Name"}}
    {{if ~groupBy("Name", "Amount")}}
      <tr>
        <td>{{>Name}}</td>
        <td>{{>~total()}}</td>
      </tr>
    {{/if}}
  {{/for}}
</tbody></table>
  

https://jsfiddle.net/BorisMoore/nx3atd1q/

И вот альтернативная версия, использующая функцию фильтрации в {{for}}:

 <table><tbody>
  {{for ItemDetails sort="Name" filter=~groupBy groupTotal="Amount"}}
    <tr>
      <td>{{>Name}}</td>
      <td>{{:~total()}}</td>
    </tr>
  {{/for}}
</tbody></table>
  

https://jsfiddle.net/BorisMoore/o4pt3brq/