2017-10-02 11 views
4

角材2には、AngularJSの角材md-item-templateのようなオートコンプリートオプションをカスタマイズするセレクタがありますか?私はdocsからdocs角材2 - オートマテリアルのカスタムマットオプション/ mdオプションテンプレート

資料2からAngularJSの例で何かを見つけることができませんでした:

<md-autocomplete 
    <md-item-template> 
     <span class="item-title"> 
     <md-icon md-svg-icon="img/icons/octicon-repo.svg"></md-icon> 
     <span> {{item.name}} </span> 
     </span> 
     <span class="item-metadata"> 
     <span class="item-metastat"> 
      <strong>{{item.watchers}}</strong> watchers 
     </span> 
     <span class="item-metastat"> 
      <strong>{{item.forks}}</strong> forks 
     </span> 
     </span> 
    </md-item-template> 
</md-autocomplete> 

enter image description here

+0

ジャストプレス '<>'(あなたのスクリーンショットのように)右上隅にある、あなたは、この例のコードが表示され、それを試してみてください。この方法で、この例のHTML、JS、CSSコードを見ることができます。 –

+0

@CommercialSuicide私はAngularJSからのこの例を知っています、私は[Angular Material](https://material.angular.io/)にもこのオプションがあるかどうか尋ねています。あなたが私の質問を理解していない場合は申し訳ありません。 – Rafael

+0

申し訳ありませんが、私のせいです –

答えて

1

私も良い「オール材質のようにそれを行うための正しい方法を探しています1. これは私がそれを材料5で動作するように得ることができる醜いハックです:

スタイル:

.mat-option { 
    height: 50px; 
    line-height: 20px; 
} 

テンプレート:

<mat-autocomplete #auto="matAutocomplete"> 
    <mat-option *ngFor="let state of filteredStates | async" [value]="state.name"> 
    <!-- <img style="vertical-align:middle;" aria-hidden src="{{state.flag}}" height="25" /> --> 
     <span>{{ state.name }}</span><br> 
     <small>Population: {{state.population}}</small>   
    </mat-option> 
</mat-autocomplete> 

here

関連する問題