Метод триггерного компонента Angular 2 из сервиса

У меня есть связь между двумя компонентами (one.component и two.component), и у меня есть служба (global.service) между ними. Все работает хорошо (я могу передавать значения от одного к другому, как в Angular 2 — родитель и дети общаются через сервис с сайта Angular.io). У меня есть глобальная переменная в global.service, которая удаляется из one.component, когда это происходит, мне нужно вызвать даже в two.component. Я думаю, что могу передать логическую переменную из global.service в two.component через наблюдаемую, когда это произойдет. Но, поскольку мне не нужна переменная, я думаю, что должен быть лучший способ просто вызвать метод в two.component из global.service.

Спасибо!


person H. Trujillo    schedule 12.05.2017    source источник


Ответы (2)


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

Я не думаю, что ты хочешь этого делать.

Подписка компонента на наблюдаемую из вашей службы является очень стандартным и простым поведением, даже если он получает только одну переменную. Вы можете посмотреть на свой компонент и увидеть, что именно запускает все его входы и выходы. Если вы позволите своему сервису связаться и программно настроить ваш компонент, я думаю, что в долгосрочной перспективе будет легко потерять этот факт и иметь трудно отслеживаемое поведение. По сути, вы перешли от двух человек, отвечающих за поведение вашей системы (Компонент 1 и Компонент 2), к трем ответственным: Компоненту 1, Компоненту 2 и Службе 1.

ИМО, гораздо лучше, чтобы Сервисы были простыми контейнерами данных, и пусть компоненты сами решают, когда/как/где они меняются в ответ на изменение состояния.

person Conor Mancone    schedule 12.05.2017

Обычно вы хотите отделить логику службы от использования.
Я предлагаю сохранить Subject (или BehaviorSubject, в зависимости от использования службы) в службе,
и иметь компонент parent next в нем. , и компонент child подпишется на этот Observable (каждый Subject является наблюдаемым, вы можете использовать Subject.toObservable при его возврате, чтобы убедиться, что вы не даете Subject в API).

У меня есть отличный пример для раздачи.

В настоящее время я работаю над проектом, в котором есть canvas, который получает ввод с клавиатуры от window, а также у меня есть чат на той же странице. До исправления, которое я собираюсь вам объяснить, всякий раз, когда я нажимал любую из WASD в чате, это приводило к тому, что холст получал входные данные (фактически перемещая персонажа).

Что я хотел сделать, так это перехватывать ввод всякий раз, когда я в чате.

У меня есть служба под названием GameInputDisableService, который отвечает за перехват. Он сохраняет BehaviorSubject, который инициализируется как false.

У меня есть MessageInputComponent(TS, HTML), где я внедряю службу в TS и вызываю методы службы во входных событиях focus и focusout.

На другом конце у меня есть AioGameComponent(TS), который имеет @Input() disableInput: boolean, компонент, обертывающий этот компонент переносит значение, сохраненное в GameInputDisableService, в AioGameComponent

Я надеюсь, что это сработает для вас, похоже, что этот вид услуг может вам помочь.
Разница в том, что вы можете подписаться на наблюдаемое и вызвать метод вашего компонента, вместо того, чтобы передавать значение в @Input дочернему элементу. составная часть

person Giora Guttsait    schedule 12.05.2017