AngularJSフィルタは結果をフィルタリングする前に2回クリックする必要があります

Question

私は角度で初心者です。私はこれを完全に間違った方法でやっているとは確信していますが、2度目のクリックでうまくいくので、やっと「いくらか働いて」いるので、私はこの方向に進んでしまいました。

フィルタは、最初のクリックの前に「未定義」として初期化されているため、2番目のクリックで並べ替えます。私のHTMLで

：私のコントローラで

<div class="col-xs-12 col-sm-4 location-list" ng-repeat="key in careerlist.location"> 
         <div class="locations" ng-click="careerlist.criteriaMatch()">{{key}} 
         </div> 
        </div> 

<div class="col-xs-12"> 
    <div class="row"> 
     <div class="col-xs-12 col-sm-6 col-md-4 job-container" ng-repeat="job in careerlist.career | filter : searchText | filter: selectExperience | filter: careerlist.criteria.name"> 
      <h2> 
       {{job.title}} 
      </h2> 
      <h3> 
       {{job.location}} 
      </h3> 
      <div class="job-description" ng-bind-html="job.description | limitHtml : 200"> 
      </div> 
      <br><br> 
      <button><a href="{{job.url}}">Read More</a></button> 
     </div> 
     <br><br> 
    </div> 
</div> 

：

cl.criteriaMatch = function(criteria) { 
      jQuery(document).on('click', '.locations', function(){ 
       cl.criteria = {}; 
       console.log("just the element text " + jQuery(this).text()); 
       cl.criteria.name = jQuery(this).text(); 
       return function(criteria) { 
        return criteria.name === criteria.name; 
       }; 
      }); 

     }; 

Answer 1

利用ng-clickの代わりjQuery#on('click')。 Angularは、フィルタを更新する必要があるかどうかを知りません。

更新

@Makotoはクリックが二回バインドされていることを指摘しています。 jQueryバインディングを完全に削除する必要があるようです。私はあなたのプロジェクトからjQueryを削除することを示唆しています。