アンギュラ4材質のアプリケーションでmd-autocompleteの自動選択を削除します。

Question

材質設計の角度4のアプリケーションがあります。このアプリケーションでは、内部にフォームを含むダイアログを開きます。このフォームでは、最初の位置にオートコンプリートフィールドがあります。 は、これは私のhtmlコードです：私は、ダイアログを開くと

<div class="containerDialog"> 
<h1 md-dialog-title>Add porject</h1> 
<form class="form-horizontal" role="form"> 
    <div class="form-group"> 
     <md-input-container> 
      <input mdInput type="text" mdInput [mdAutocomplete]="project" placeholder="Selectionner un projet"> 
     </md-input-container> 
     <md-autocomplete #project="mdAutocomplete"> 
      <md-option *ngFor="let project of projectsList" [value]="project.name"> 
       {{ project.name}} 
      </md-option> 
     </md-autocomplete> 
    </div> 
</form> 
<div md-dialog-actions> 
    <button md-button md-dialog-close="close">Cancel</button> 
    <button md-button md-dialog-close="save">Save</button> 
</div> 

、オートコンプリートの入力が選択されているので、project.nameのリストは、入力をクリックせずに表示されます。

入力時に入力が選択されていないようにするにはどうしたらいいですか？

Answer 1

私には同様の問題がありました。私のために、cdk-focus-region-startを容器に加えました。これは親formにcdk-focus-region-startを追加してみてくださいとdivからそれを削除動作しない場合は

<div cdk-focus-region-start class="form-group"> 
    <md-input-container> 
    <input mdInput type="text" mdInput [mdAutocomplete]="project" placeholder="Selectionner un projet"> 
    </md-input-container> 
    <md-autocomplete #project="mdAutocomplete"> 
    <md-option *ngFor="let project of projectsList" [value]="project.name"> 
      {{ project.name}} 
    </md-option> 
</md-autocomplete> 

：あなたのケースでは

はこれを試してみてください。