Есть замечательный пакет
reactive-table, который позволяет сэкономить массу времени на выводе коллекции объектов в табличном виде. В этом пакете из коробки работают:
- сортировка
- настройка отображения только части полей
- кастомизация полей
- фильтрация по подстроке
Собственно, с фильтрацией и была основная проблема.
Для отрисовки таблицы нужно вызвать шаблон:
{{> reactiveTable collection=cases settings=tableSettings}}
В результате чего будет отрисована строка с фильтром (в правом верхнем углу) и под ней таблица с данными.
По дизайну моего приложения строка фильтра должна была находиться среди других управляющих элементов и совсем не справа. Разработчик reactive-table не предлагает возможности разместить этот элемент в другом месте. Загонять элемент на нужное место ухищрениями CSS мне показалось неправильным.
Поэтому я решил, что необходимо разделить таблицу и окно с фильтром на два шаблона, чтобы их можно было располагать независимо:
{{> reactiveTableFilter settings=tableSettings space='cases'}}
...
<!-- немного HTML -->
...
{{> reactiveTable collection=cases settings=tableSettings space='cases'}}
Сейчас я не буду рассказывать как я это делал (напишу другую статью), но хотел бы остановиться именно на том, как самостоятельно изменить чужой пакет для Meteor.
По шагам:
- Форкнуть проект на 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
Если вы сочли ваши изменения полезными для других можно сделать pull-request автору оригинального пакета.