1

ng-repeat の実行のタイミングに関するいくつかの奇妙な AngularJS1 の動作を特定したと思います。したがって、コントローラーの実行のタイミングと競合します。

私のコントローラーは自動的に html アンカー ID までスクロールします: $anchorScroll('html_id');

これは、静的 html ( static html plunker )で問題なく動作します。

<div id="hello1">Hello1 </div>

ただし、ng-repeat ( ng-repeat plunker )によって生成された div でコントローラーによって呼び出された場合、anchorScroll は機能しないようです。

 <div id="{{ITEM.slug}}" ng-repeat="ITEM in LIST">{{ITEM.slug}}</div>

注:: ng-repeat の anchorScroll はボタンで正常に動作しますが、読み込み時に自動的にスクロールしたい...

(ng-init= を使用してスクロール関数を呼び出すことも試みましたが、同じタイミングの問題です。そのため、アンカーを見つけることができません... ng-repeat の後にコード化されていても)

アイデア/回避策はありますか?

(バインドする ng-repeat イベントはないようです...)

4

1 に答える 1

1

これが機能するには、アイテムが実際にレンダリングされるように、ダイジェスト サイクルの後$anchorScrollに実行する必要があります。

これを実現する最も簡単な方法は、解決される promise を作成する 2 番目の遅延を使用$timeoutすることです。遅延により、Promise はすぐに処理されるのではなく、現在のダイジェスト サイクルが完了した後0に処理されます。0

testApp.controller('testCtrl', function($scope, $anchorScroll, $timeout) {
  $scope.LIST = [{
    "slug": "hello1"
  }, {
    "slug": 'hello2'
  }, {
    "slug": 'hello3'
  }];

  $timeout(function() {
    $anchorScroll('hello3');
  }, 0);
});

https://plnkr.co/edit/53hlGNig7eozlm1vqkQL?p=preview

于 2016-10-05T16:32:46.750 に答える