2016-05-22 6 views
0

Я думаю, эта проблема обсуждалась ранее, как для нового RC-маршрутизатора, так и для устаревшего маршрутизатора. Предпочтительным решением, казалось, было использование служб для передачи данных до компонентов, активированных маршрутизатором-выходом.Angular2 RC1: Передача данных до компонентов

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

Маршрут называется так: «/ автомобиль/123/двигатель/4/sparkcoil»

, что означает: получить данные для искровой катушки для двигателя с ID 4, который, в свою очередь, является частью автомобиля с ID 123.

Итак, есть 3 компонента с вложенными маршрутами, компонент «автомобиль», компонент «двигатель» и компонент «искровой катушки». Первые компоненты имеют роутер-выход, в котором отображается дочерний компонент. Пока не слишком сложно.

Давайте сделаем некоторые предположения:

1) В «Мотор» компонента I необходимо иметь доступ к данным автомобиля, и в компоненте «индукционная катушка», мне нужно иметь доступ как к данным автомобиля и данные двигателя.

2) Бэкэнд-звонок для получения автомобиля не будет содержать данные обо всех доступных типах двигателей из-за огромного объема данных. Поэтому данные о автомобилях, двигателях и искровых катушках должны быть выбраны в виде отдельных обратных вызовов.

Первый компонент, который активирован для маршрута «/ автомобиль/123», является автомобильным компонентом. У него есть введенная услуга, которая делает бэкэнд-вызов и возвращает Observable, на который подписываются компоненты.

Затем активируется второй маршрут «/ двигатель/4». Мне нужно знать об объекте автомобиля, получаемом родительским компонентом. В дальнейшем активируется компонент «/ sparkcoil», который также должен знать о двигателе и автомобиле. Очевидно, что сейчас нет способа заставить его пройти мимо декоратора @Input. Частые рекомендации: используйте услугу. Хорошо, поэтому я внедряю сервис X в автомобиль и моторный компонент. Здесь возникает боль. У меня нет удовлетворительного решения для проектирования сервиса, не обнаружив себя в адских и других наблюдателях.

Идея 1:

Автомобиль и двигательный компонент вызов функции от службы имени fetchMotor (идентификатор) и fetchCar (идентификатор), который, в свою очередь, вызовет метод следующего() из в motorFetchedEventEmitter и carFetchedEventEmitter. Двигатель и компонент искровой катушки подписываются на все EventEmitters, чтобы получить информацию о том, когда извлечены данные бэкэнд. Тем не менее, я не знаю, подписываются ли компоненты EventEmitter до или после того, как стреляют. Если раньше, все хорошо, если после этого мне нужно будет «переиграть» эмитталы (см. Observable.replay (...)). Поскольку служба и их EventEmitters создаются только один раз, воспроизведение Observables означает, что я могу получить много (неактуальных) событий.

Идея 2:

Я сделаю это наоборот. Автомобиль и компонент двигателя остаются бездействующими до тех пор, пока не будет вызван компонент искровой катушки. Этот компонент разрешает все сегменты маршрута, выполняет соответствующие обратные вызовы и разворачивает бэкэнд-ответ через EventEmitters службы к компоненту «автомобиль» и «двигатель». Я признаю, что этот подход довольно контрпродуктивен в отношении маршрутизации нового компонента с RC1.

Возможно, существует лучшее решение для этого сценария, учитывая крючки жизненного цикла. Согласно документам, интерфейс OnActivate (см. https://angular.io/docs/js/latest/api/router/OnActivate-interface.html) говорит, что когда onActivate возвращает обещание, все дочерние компоненты не будут активированы до тех пор, пока не будет разрешено обещание. Я не думаю, что существует аналогичная функциональность для маршрутизируемых компонентов.

Есть ли у кого-нибудь понятие, как решить это как можно шире.

Спасибо за ваши идеи заранее. Мне нужно выпить кофе! : -?

ответ

0

Вы не должны использовать EventEmitter в услугах. Это была обычная практика в течение довольно длительного времени, но EventEmitter следует использовать только для компонентов @Output().

Я думаю, что вся проблема - это просто проблема дизайна, связанная с использованием наблюдаемых и сервисов (я не говорю, что это простая проблема для решения).

Использование BehaviorService может быть возможностью исправить проблемы с сроками, когда услуги подписываются на наблюдаемые после, они выбрали значение. С BehaviorService новый абонент немедленно получает последнее испущенное значение.

Ваш вопрос не содержит достаточной информации для более подробных предложений и в любом случае кажется слишком широким для StackOverflow. Если вы можете разбить проблему на отдельные проблемы и создать для них новые вопросы, может быть проще сделать конкретные предложения о том, как ее исправить.

+0

Hi Günter, Это наверняка вещь дизайна, а не только техническая проблема. Наверное, Redux и подход к управлению государствами не вышли из ниоткуда. Как вы сказали, BehaviorSubject (я думаю, вы имели в виду, что, а не BehaviorService), вероятно, является приемлемым решением для моего сценария. Не слишком далеко от этой интересной статьи об Angular2 и говорится: https://medium.com/front-end-developers/managing-state-in-angular-2-using-rxjs-b849d6bbd5a5#.hnep5xalp, который следует за одним - принцип потока данных о сокращении. – Matt

+0

В порядке справа, 'BehaviorSubject' –

Смежные вопросы