Синхронизировать поля на реактивной форме Angular

  /**
   * Синхронизировать ввод значений контролов формы
   * @param a - первый контрол
   * @param b - второй контрол
   */
  private _syncControlValues(a: AbstractControl, b: AbstractControl): void {
    a.valueChanges
      .pipe(takeUntil(this._destroy$))
      .subscribe(value => b.setValue(value, { emitEvent: false }));
    b.valueChanges
      .pipe(takeUntil(this._destroy$))
      .subscribe(value => a.setValue(value, { emitEvent: false }));
  }

UPD: 19 января 2019 г. Альтернативный подход:
Создание отдельного контрола.

import { Component } from '@angular/core';
import { FormControl } from '@angular/forms';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  search = new FormControl('tyapk');
}

В шаблоне компонента использовать созданные контрол во всех полях

<input placeholder="search 1" [formControl]="search" [value]="search.value" />
<input placeholder="search 2" [formControl]="search" [value]="search.value" />
<input placeholder="search 3" [formControl]="search" [value]="search.value" />

Похожие записи

ngx translate attribute

Используется конструкция

<img src="image.jpg" [alt]="'KEY' | translate"> 
19 августа 2018 г. в Angular

Angular dependency injection

Определение Provider (useClass, useValue, useFactory ), Injector. Декоратор @Inject, ключ multi: true

13 ноября 2018 г. в Angular

Angular. Manually retry http request

На память. Некоторое время назад я решил достаточно необычную задачу, но в последствии на backend`е переделали логику и код был удалён из проекта.

Angular routerLink conditionally

<a [routerLink]="myVar ? '/home' : null" routerLinkActive="is-active">Home</a>
or
<a [routerLink]="myVar ? ['/home'] : []">Home</a>
02 сентября 2019 г. в Angular