Открытие ссылки из Angular material-автозаполнение?

#html #css #angular #angular-material

#HTML #css #angular #angular-материал

Вопрос:

Я использую Angular для своего проекта и создал поле поиска. Я хотел бы иметь возможность нажимать на выпадающие параметры, чтобы при нажатии на опцию открывалась ссылка. Это HTML для параметров.

 <mat-autocomplete #auto="matAutocomplete">
        <mat-option *ngFor="let option of filteredOptions | async" [value]="option">
          {{option}}
        </mat-option>
</mat-autocomplete>
  

Есть ли простой способ сделать так, чтобы можно было щелкнуть параметры и открыть ссылку? Или мне придется использовать событие (щелчок) в каком-то качестве? Каков наилучший способ добиться этого?

Ответ №1:

Вы можете добавить a или button пометить свой элемент mat-option.

 <mat-option *ngFor="let option of filteredOptions | async" [value]="option">
  <a href="http://www.google.com">{{option}}</a>
</mat-option>
  

Ссылка: https://stackblitz.com/angular/aaljlkxaorrk?file=src/app/autocomplete-auto-active-first-option-example.html

Комментарии:

1. Можно ли сделать параметры парой ключ-значение, чтобы конкретные параметры приводили к конкретным веб-сайтам? Когда я попытался это реализовать, в итоге я получил ряд ошибок, в которых говорилось, что параметры должны иметь тип String[] . Есть ли способ обойти это?

2. Можете ли вы сослаться на это, это может помочь вам Ref: stackblitz.com/angular /…