угловой материал мат-автозаполнение открывает панель

Question

У меня есть модал с автозаполнением полей. Я использую Angular 5 с угловым материалом 2. Когда модал загружается, панель первого поля всегда открыта ...

Как этого избежать?

Я пытался использовать атрибут автофокуса на другом поле, но он не работает ...

<form name="indexation">
                  <br>
                  <div class="row">
                    <div class="col-md-12">
                      <mat-form-field class="index-full-width">
                        <input
                          matInput
                          type="text"
                          [(ngModel)]="patientChoice"
                          placeholder="Patient"
                          aria-label="Patient"
                          [matAutocomplete]="autoPatient"
                          [formControl]="myControl">
                        <mat-autocomplete (optionSelected)="selectPat()" #autoPatient="matAutocomplete" [displayWith]="displayFnPat">

                          <mat-option *ngFor="let patient of filteredPatients | async" [value]="patient">
                            <span>{{ patient.lastName }}</span>
                            <small>{{patient.firstName}}</small> |
                            <span>né(e) le {{ patient.dateNaissance }}</span> |
                            <small>IPP: {{patient.ipp}}</small>
                          </mat-option>
                        </mat-autocomplete>
                      </mat-form-field>
                    </div>
                  </div>
                  <br>

Эта проблема проистекает из материала или нет?

Answer 1

Панель результатов автоматически откроется, когда появятся опции для отображения, и поле будет в фокусе. По умолчанию диалоги устанавливают фокус на первый фокусируемый элемент, поэтому я предполагаю, что именно поэтому ваше автозаполнение открывается при загрузке диалога. Чтобы избежать этого, используйте параметр MatDialogConfig autoFocus: false при запуске диалога.