2017-01-28 7 views
0

私はhtmlリストにいくつかのテキスト項目があります。私はユーザが最初の文字を入力するときに、リスト項目をフォーカスに持って来る必要があります。ユーザの最初の文字がオプションの場合、select-optionに似たテキストです。マッチングオプションに焦点が当てられます。私はリストのために同じ振る舞いをする必要があります。私は、角度のng-repeatディレクティブを使用して私のリストをレンダリングしています:AngularJS: `select-option`に似たリスト項目にフォーカス動作を追加します

<ul class="list-group m-3 col"> 
    <li ng-repeat="song in ctrl.songs | orderBy" class="list-group-item list-group-item-action" tabindex="{{$index}}"> 
    <span>{{song}}</span> 
    </li> 
</ul> 

私はプラグイン/ライブラリのグーグルが、残念ながらいずれかを見つけることができませんでした。私はこのためにdirectiveと書くことができますが、時間が許せません。だから誰でもライブラリ/プラグインがあれば教えてください。 plunkrです

答えて

0

ブートストラップのjQuerytabindexで良質な時間を過ごした後、ついにそれを動作させました。

function bringToFocus(text) { 
     var item = element.children().filter(function(child) { 
      return angular.element(this).text().trim().toLowerCase().startsWith(text.toLowerCase()); 
     }).first(); 
     item.focus(); 
     } 

ここでは、作業plunkrです。それが誰かにとって役に立つかもしれないことを願っています。

関連する問題