Как организовать включение слоев (компонентов)?

У меня есть список элементов меню: Самолеты, Поезда, Автобусы.

Элементы меню кликабельны и активируют определенный, главный компонент, который вставляется в <ng-template></ng-template>.

Для самолетов это компонент: AirPlaneComponent и тд.

Также пользователь может включить компоненты не через меню, например компонент AddAirPlaneComponent, который при активации должен отобраазитьс вместо AirPlaneComponent. При этом, важно, если AddAirPlaneComponent дезактивируется, то нужно показать предудыщий компонент AirPlaneComponent.

Я решил создать сервис, который хранит историю активации компонентов в стеке, для каждого корневого меню - стек свой.

ComponentService {
    airplaneStack: ComponentType[];
    carStack: ComponentType[];
    busStack: ComponentType[];
}

Где стек - это список из ранее активированных компонентов. Что дает знать, какой компонент сейчас активирован и какой был до этого (n-1).

Теперь в сервисе я могу прослушать, какой элемент меню был активирован, например меню типа Самолеты.

Тогда я активирую нужный компонент и помещаю в стек airplaneStack.

Если через меню актвируется другой компонент - который тоже относится к Самолеты. Например добавление самолета. То он тоже добавляется в стек airplaneStack.

Проблема в следующем:

  1. На каждый корневой пункт меню приходится создавать свой стек
  2. Всегда при возникновении события (клик по меню или клик извне) - нужно определять тип события, чтобы определить его в нужны стек.
  3. Стек связывет пункт меню с компонентом, который нужно активировать.
  4. Стек должен всегда иметь ссылку на компонент (первый элемент массива)

Правильный у меня подход? Как бы вы это решили?

Я думаю это можно сделать одним списком. Каждый элемент списка может ссылаться на другой. Связанный список.

Если активируется меню Самолеты и у этого элемента есть ссылка на Добавление Самолета. То активируем Добавление Самолета.

Если дезактивируем Добавление Самолета. То Самолеты больше не ссылается на Добавление Самолета. Поэтому будет активированы Самолеты.


Ответы (0 шт):