I have used onSelectionChanged event to get the value of selected item on mat-autocomplete

<mat-form-field class="container">

        <input type="text"  (input)="onInputChanged($event.target.value)" placeholder="Search addresses ..."
            matInput 
            [formControl]="searchAddress" 
            [matAutocomplete]="auto"
            >  

        <mat-autocomplete (optionSelected)="onSelectionChanged($event)" #auto="matAutocomplete">
          <ng-container *ngFor='let filteredAddresses of addresses'>
              <mat-option *ngFor="let address of filteredAddresses" [value]="address.Text">
                <small>{{address.Text}}</small>
              </mat-option>
              </ng-container>

        </mat-autocomplete>
    </mat-form-field>

How can I update an input text item with the value selected from the mat-autocomplete.How can I update addressLine1 for below:

 <div class="form-group col-md-3 col-sm-3 col-xs-12">
          <label l10nTranslate
            >label.addressLine1</label
          >
          <input
            class="form-control"
            [(ngModel)]='addressLine11'

          />

        </div>

I tried something like:

onSelectionChanged(event: MatAutocompleteSelectedEvent) {
        console.log('event',event.option.value);
        this.addressLine11 = event.option.value;
      }

But was giving error as addressLine11 value doesn't exist all the time.Please suggest how can I change the code.

1 Answers

0
Community On

Could it be a typo? Could you try below, without label.addressLine11

<label l10nTranslate>addressLine11</label>