angular - Hur man skickar argument från UI till graphql för att hämta data

Jag har en GraphQL-URL där jag kan hämta data från backend. Problemet är dock att jag för närvarande anger ett hårdkodat id för en kund för att hämta data. Jag vill skapa en inmatningsruta och sedan tillåta användaren att hämta vilken kundpost som helst genom att ange kund-id. Nuvarande hårdkodade kod för att hämta kundpost:

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);

});

}

Hur överför jag värde från UI, jag behöver något liknande Angulars tvåvägsbindning med ngModel. Jag provade denna kod men jag får felet 'Unterminated String'.

  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;
});
}

Kan någon hjälpa mig att lista ut hur man skickar värden?