Правильная реализация Angularjs UI-маршрута для нескольких представлений

Question

Я хотел бы реализовать такую ​​страницу

У меня следующая структура папок:

-root/
--root.controller.js
--root.module.js
--root.routes.js
--root.html
--filters/
----filters.controller.js
----filters.module.js
----filters.routes.js
----filters.html
--tableData/
----tableData.controller.js
----tableData.module.js
----tableData.routes.js
----tableData.html
--graph/
----graph.controller.js
----graph.module.js
----graph.routes.js
----graph.html

Я хотел бы знать лучший подход для наилучшего управления вызовами с каждого контроллера. Я имею в виду, что из фильтров я могу изменить выбор в раскрывающемся списке или обновить значения других полей, а затем обновить данные в табличных данных. И если я изменю выбор таблицы данных, я обновлю график. Корневой URL-адрес - «/ root / {itemId}», и я не могу добавить какое-либо другое значение в строку запроса. Как я могу управлять внутренними переменными и методами?

большое спасибо

Answer 1

Насколько я понимаю, лучше пойти на события $emit, $broadcast & on, чтобы достичь того же.

Как я вижу, у вас есть независимые контроллеры, не связанные с большинством других контроллеров.

Несколько предложений по его реализации:

1. используйте $rootScope.$emit и $rootScope.on, если их контроллеры не связаны между собой. Убедитесь, что вы удаляете его вручную (может быть проигнорировано, если приложение не слишком тяжелое, но следует помнить). Эта ссылка, безусловно, будет полезна . Например:

Если фильтр будет изменен, будет вызвано событие filter-changed. graph.controller и table.controller будут проинформированы и отобразят соответствующий интерфейс.

2. Создайте службу messaging, откуда контроллеры будут подписываться и отписываться от events. Это будет держать номера events под контролем. Вы будете знать, сколько событий на самом деле было создано в приложении.