Есть замечательный пакет reactive-table, который позволяет сэкономить массу времени на выводе коллекции объектов в табличном виде. В этом пакете из коробки работают:
Собственно, с фильтрацией и была основная проблема.
Для отрисовки таблицы нужно вызвать шаблон:
Поэтому я решил, что необходимо разделить таблицу и окно с фильтром на два шаблона, чтобы их можно было располагать независимо:
По шагам:
- сортировка
- настройка отображения только части полей
- кастомизация полей
- фильтрация по подстроке
Собственно, с фильтрацией и была основная проблема.
Для отрисовки таблицы нужно вызвать шаблон:
{{> reactiveTable collection=cases settings=tableSettings}}
В результате чего будет отрисована строка с фильтром (в правом верхнем углу) и под ней таблица с данными.
По дизайну моего приложения строка фильтра должна была находиться среди других управляющих элементов и совсем не справа. Разработчик reactive-table не предлагает возможности разместить этот элемент в другом месте. Загонять элемент на нужное место ухищрениями CSS мне показалось неправильным.
Поэтому я решил, что необходимо разделить таблицу и окно с фильтром на два шаблона, чтобы их можно было располагать независимо:
{{> reactiveTableFilter settings=tableSettings space='cases'}}
...
<!-- немного HTML -->
...
{{> reactiveTable collection=cases settings=tableSettings space='cases'}}
По шагам:
- Форкнуть проект на github: https://github.com/ecohealthalliance/reactive-table.git
- cd my-project
- mkdir packages
- cd packages
- git clone https://github.com/a-ruzin/reactive-table.git
- добавим ссылку на оригинальный репозиторий, чтобы можно было pull'ить изменения
git remote add up https://github.com/ecohealthalliance/reactive-table.git - cd reactive-table
- 4-ую строку package.js заменим на: "xxx:reactive-table"
- cd ..
- meteor add xxx:reactive-table
В четвертом пункте вместо 'xxx' может быть любая строка (например, ваш аккаунт на meteor.com).
Все, после этого уже можно править код.
Все, после этого уже можно править код.
Желательно сразу переключиться на другую ветку, чтобы уменьшить количество проблем с merge, если ваши изменения окажутся кривыми или за время разработки основной разработчик убежит вперед:
- git checkout -b my-feature
Теперь мы свободно меняем исходник пакета и проверяем его работу на своем живом проекте.
После того, как все отладили, commit'им и затаскиваем в свой репозиторий на github.com.
- git commit -am "my feature"
- git push origin my-feature
