angular - Cum să treci un argument din interfața UI către GraphQL pentru a prelua date

Am un URL GraphQL de unde pot prelua date de la backend. Totuși, problema este că în prezent ofer identificatorul unui client codificat pentru a prelua date. Vreau să creez o casetă de introducere și apoi să permit utilizatorului să preia orice înregistrare a clientului introducând Id-ul clientului. Codul actual codificat pentru a prelua înregistrarea unui client:

ngOnInit() {
this.apollo
.watchQuery({
  query: gql`
    {
      findCustomer(id: "UF2aLa1L687") {
        id
        customerType
      }
    }
  `,
})
.valueChanges.subscribe(result => {
  this.customer = result.data ;
  this.loading = result.loading;
  this.error = result.errors;
  console.log('Customer Info', this.customer);
  console.log('Loading', this.loading);
  console.log('Error', this.error);

});

}

Cum pot transmite valoarea din UI, am nevoie de ceva similar legării bidirecționale în Angular folosind ngModel. Am încercat acest cod, dar primesc eroarea 'Șir neîncheiat'.

  searchByCustomerIdGraphQL() {
console.log(this.customerIdValue);
this.isLoadingResults = true;
this.apollo.watchQuery({
  query: gql`
  {
    findCustomer(id : "` + this.customerIdValue + `") {
      id
    }
  }
  }`
}).valueChanges.subscribe( result => {
  this.customerSearchRecord = result.data;
  this.loading = result.loading;
  this.error = result.errors;
});
}

Poate cineva să mă ajute să înțeleg cum să transmit valori?