Scroll inside tbody angularjs

Question

私は角度jを使って1つのテーブルを作成しました。今私は特定のテーブルの行にテーブルの行をスクロールする必要があります。私は$ anchorScrollを試しましたが、それは私のために働いていません。

<div class="tab-pane fade in active" id="scorecard"> 
    <table class="header-fixed table"> 
     <tbody> 
      <tr ng-repeat="x in test" ng-class="x == 41 && 'current-user current-user-scroll' || x.show == 0 && 'tng-hide-user' || 'non-current-user'" ng-cloak dashboard-data"> 
      <td class="col-xs-2" >{{ x }}</td> 
      <td class="col-xs-8">{{ x }}</td> 
      <td class="col-xs-2">{{ x }}</td> 
      </tr> 
     </tbody> 
    </table> 
    </div> 

私が上記のコードから欲しいのは、テーブルを直接41行目にスクロールする必要があるということです。

ありがとうございます。

Answer 1

私はこのようなウェブ上の指示を作成します。

このコードを使用してください。

app.directive('scrolly', function() { 
     return { 
      restrict: 'A', 
      link: function (scope, element, attrs) { 
       var raw = element[0]; 

      element.bind('scroll', function() { 

       if (raw.scrollTop + raw.offsetHeight > raw.scrollHeight - attrs.preLoadOffset) { 
        scope.$apply(attrs.scrolly); 
       } 
      }); 
     } 
    }; 
}); 

スクロール終了前にロードするpreLoadOffsetを追加しました。

は、ここで例のテンプレートとコントローラ

<div class="scroll" id="antTalkList" view-type="total" 
     scrolly="$ctrl.loadMore()" pre-load-offset="100"> 
    <ul class="user_list list ng-scope" > 
     <li class="clearfix express" ng-repeat="item in $ctrl.items"  ng-click="$ctrl.showAntTalk(item.articleId);"> 
    ... 

だと、これは、コントローラスニペット

... 
this.pageCount = 20; 
this.isScrollEnd = false; 
this.loadMore = function() { 
    if(!self.isScrollEnd){ 

     $http.get('ant/list/json?pageCount=' 
         +self.pageCount 
         +'&startIndex=' 
         + self.items.length 
         + '&sectionId=' 
         + $attrs.talkType 
       ).then(function mySucces(response) { 
      var apiRes = response.data; 

      if (apiRes.result_code == 'S0000') { 
       var list = apiRes.result.list; 
       if(list.length === 0) self.isScrollEnd = true; 
       for (i in list) { 
        self.items.push(list[i]); 
       } 
      } 
     }); 
    } 
} 

this.loadMore(); 
...