Как известно, в ExtJs 5 помимо обычных MVC-контроллеров, появился новый тип контроллеров - ViewController. О нём и поведу речь. Но сначала два слова о старых контроллерах.
Старые контроллеры могли существовать только в одном экземпляре. Из них было удобно управлять представлением (таблицей, диаграммой, шаблоном и т.д.), которое также существует в единственном экземпляре. Подсовывая в такое представление разные наборы данных, загружаемых с сервера, создавали впечатление что представлений много. Такой подход значительно сокращал количество элементов в DOM. Однако в том случае, когда на экране нужно одновременно отобразить несколько экземпляров представления, работа с контроллером несколько усложнялась, поскольку теперь нужно управлять коллекцией представлений. Инструменты, предоставляемые контроллером не были приспособлены для управления коллекциями. Вспомните, например, refs и автоматически генерируемые методы...
И вот на сцену выходят "контроллеры представления". Под каждый новый экземпляр графического представления создаётся отдельный экземпляр контроллера. При уничтожении представления уничтожается и его персональный контроллер. Нововведение значительно оздоровило создаваемый код. В новые контроллеры пишем то, что писали раньше при определении listeners представления. То есть, код представления всё больше становится похожим на конфигурационный объект, практически лишённый определений функций. Все функции перекочевали в новые контроллеры.
Чтобы контроллеры у вас заработали нужно помнить несколько простых правил:
Если нужно, чтобы новые контроллеры общались между собой, следует использовать параметр "config". Ниже перечислены все три этапа межконтроллерного взаимодействия.
1. Назначим обработчик события в представлении.
2. В родном контроллере выбрасываем событие, для прослушивания прочими контроллерами.
3. Чужой контроллер "улавливает сигнал" и вносит изменение в своё представление.
Замечу, что для прослушивания всех контроллеров, нужно написать звёздочку вместо имени конкретного контроллера.
Поскольку такая техника работы может привести к многоразовой перерисовке всего веб-интерфейса, полезно останавливать рендеринг на время при помощи Ext.suspendLayouts(). Если этого не сделать, то всё будет происходить жутко медленно.
Вот такие они новые контроллеры...
Вот ещё один способ работы с контроллерами представлений.
Старые контроллеры могли существовать только в одном экземпляре. Из них было удобно управлять представлением (таблицей, диаграммой, шаблоном и т.д.), которое также существует в единственном экземпляре. Подсовывая в такое представление разные наборы данных, загружаемых с сервера, создавали впечатление что представлений много. Такой подход значительно сокращал количество элементов в DOM. Однако в том случае, когда на экране нужно одновременно отобразить несколько экземпляров представления, работа с контроллером несколько усложнялась, поскольку теперь нужно управлять коллекцией представлений. Инструменты, предоставляемые контроллером не были приспособлены для управления коллекциями. Вспомните, например, refs и автоматически генерируемые методы...
И вот на сцену выходят "контроллеры представления". Под каждый новый экземпляр графического представления создаётся отдельный экземпляр контроллера. При уничтожении представления уничтожается и его персональный контроллер. Нововведение значительно оздоровило создаваемый код. В новые контроллеры пишем то, что писали раньше при определении listeners представления. То есть, код представления всё больше становится похожим на конфигурационный объект, практически лишённый определений функций. Все функции перекочевали в новые контроллеры.
Чтобы контроллеры у вас заработали нужно помнить несколько простых правил:
- добавьте полное имя класса контроллера в Application.js в параметр "views". Это не опечатка, не в параметр "controllers". В параметр "controllers" будете вносить классы старого типа контроллеров, которые по-прежнему можно создавать.
- внесите в тот же раздел Application.js полное имя класса представления, чтобы оно подгружалось и ещё чтобы оно попадало в сборку, создаваемую через "sencha app build".
- теперь соедините представление с его контроллером. Для этого в контроллере укажите параметр alias, назначив ему значение, которое содержит префикс "controller.". Например, alias: 'controller.myapp-myviewcontroller'. В представлении укажите параметр "controller". Например так: controller: 'app-myviewcontroller'.
- определяя обработчики событий представления в listeners, укажите названия методов его контролера.
Если нужно, чтобы новые контроллеры общались между собой, следует использовать параметр "config". Ниже перечислены все три этапа межконтроллерного взаимодействия.
1. Назначим обработчик события в представлении.
2. В родном контроллере выбрасываем событие, для прослушивания прочими контроллерами.
3. Чужой контроллер "улавливает сигнал" и вносит изменение в своё представление.
Замечу, что для прослушивания всех контроллеров, нужно написать звёздочку вместо имени конкретного контроллера.
Поскольку такая техника работы может привести к многоразовой перерисовке всего веб-интерфейса, полезно останавливать рендеринг на время при помощи Ext.suspendLayouts(). Если этого не сделать, то всё будет происходить жутко медленно.
Вот такие они новые контроллеры...
Вот ещё один способ работы с контроллерами представлений.
