typescript - Angular 13 - Inițializare FormControl din Observable


Am o aplicație Angular cu un component care are un Formular Reactiv cu un singur FormControl, acest FormControl se află într-un ngComponent în care este injectat un ngService care are un Observable care reprezintă valoarea.

@Component({
  selector: 'app-preferences',
  templateUrl: './preferences.component.html',
  styleUrls: ['./preferences.component.css']
})
export class PreferencesComponent implements OnInit {
  url = new FormControl();
  //...
}

// -----

@Injectable({
  providedIn: 'root'
})
export class PreferencesService {

  private readonly url= new BehaviorSubject<string>("http://localhost:5433");
  readonly url$ = this.url.asObservable();

  updateUrl(url: string) {
    this.url.next(url);
  }

Cum inițializezi valoarea implicită pentru FormControl din Observable-ul Serviciului? Care este cea mai bună modalitate de a conecta un Observable obișnuit rxjs și un FormControl?

Am încercat acest cod:

constructor(
    private readonly pref: PreferencesService
) { 
    this.pref.url$.pipe(take(1)).subscribe(x => this.url.patchValue(x));
    this.url.valueChanges.subscribe(x => this.pref.updateUrl(x));
}

Și funcționează, dar cred că este o soluție îngrozitoare.