Angular 2 трехкомпонентная передача данных

Question

У меня есть 3 Angular компонентов.
первый из них app.component
второй test1.component и
третий test2 .component

app.component. html

<app-test1 [(value)]="name" ></app-test1>
<button (click)="click()">Save</button>

test1.component. html

<app-test2 [(value)]="value"></app-test2>

test2.component. html

<input type="test" [(ngModel)]="value">

Я хочу перенести тестовое изменение 2.компонентного входа непосредственно в app.component без использования «Выходных данных» , (this.name)

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

✔ <input type="test" [(ngModel)]="value">
❌ <input type="test" [(ngModel)]="value" (entityChange)="value = $event">

Пример для вас попробовать: StackBlitz Хочу обойтись без вывода.

Answer 1

Создайте сервис с помощью rx js Подпишите и добавьте его в app и test2

// свойство в сервисе

 inputUpdate = new Subject()

В test2 // введите сервис в конструкторе

<input type="test" (change)="someService.inputUpdate.next($event)>

В приложение добавить тот же сервис в конструктор и подписаться на обновления

this.someService.inputUpdate.subscribe( (value) => { //do smth  })