リストを並べ替える方法まず最初にmd-autocompleteに文字列検索が含まれていますAngularJS

Question

私はangularJsが新しく、検索結果をフィルタリングしたいと思います。 https://codepen.io/anon/pen/mpJyKm

文字列が含まれ、結果リストの最初に来るで始まり、そのように私はフィルタクエリ入力に基づいて結果を検索したい：ここ

は一例です。私は md-autocompleteの例を使用していて、 コントローラでフィルタリストをフィルタリングする必要があります。

e.g. If search input is : A 
then result should be like this : 
Alabama 
Alaska 
Arizona 
Arkansas 
California 
Colorado 
... 

は、フィルタリング結果のためにこれを試みたが、で始まるを返すか、私が必要として、フィルタリングせずに任意の順序で含まれています

function createFilterFor(query) { 
    var lowercaseQuery = angular.lowercase(query); 
    return function filterFn(state) { 
    return (state.value.indexOf(lowercaseQuery) != -1); 
    }; 
} 

Answer 1

あなたはこのようなquerySearch()機能を使用することができます：あなたは

function querySearch (query) { 
    var q = angular.lowercase(query); 
    var results = self.states 
    .reduce(function(res, state) { 
     var idx = state.value.indexOf(q); 
     if(idx === 0) { 
     res[0].push(state) 
     } else if(idx > 0) { 
     res[1].push(state) 
     } 
     return res; 
    },[[],[]]) 
    return results[0].concat(results[1]); 
} 

をすべての状態を通過し、クエリに一致するものを2つの配列のいずれかに配置できます。最初の状態はクエリから開始され、2番目の状態は真ん中にあります。これらの配列を形成したら、それらを連結することができます。 allStatesは既にアルファベット順にソートされているので、後で追加ソートする必要はありません。https://codepen.io/anon/pen/QajOqj/

：あなたは大文字と小文字を区別しない方法でマッチングパターンを強調したい場合は

また、あなたはあなたの項目テンプレート

<md-item-template> 
    <span md-highlight-text="ctrl.searchText" 
      md-highlight-flags="i">{{item.display}}</span> 
</md-item-template> 

CodePenにmd-highlight-flags="i"を追加する必要があります