私はstackoverflowで多くの投稿をしてきましたが、私はまだ答えを見つけることができませんでした。 jQueryスクロールバープラグイン(nanoscroll)があり、ng-repeatの後に更新したいと思っています。場合、問題は(私がなぜ分からない)ということであるng-repeat後のAngularJS NanoScrollerは表示されません
<div class="nano"> <!-- my scrollable area -->
<div ng-controller="MyController">
<div ng-repeat="item in items" post-render>
...
</div>
</div>
Some content here...
</div> <!-- my scrollable area -->
:
myApp.directive("postRender", function() {
return function(scope, element, attrs) {
jQuery('.nano').nanoScroller({preventPageScrolling: true});
}
});
し、私のようなものを持っている:ここ として多くの記事は、私がこのようなディレクティブを使用しました、示唆しますコンテンツは.nano div
の利用可能なサイズよりちょっとだけ大きいですが、スクロールバーは表示されません。
私は、AnglerJSがコントローラの後にnanoscrollerを更新しようとする前にコンテンツを挿入するのを待たず、このコンテンツがposrt-renderディレクティブの後に追加されると考えます。 ところで、私はこの問題がNanoScrollerに由来するのではないかと疑っています。なぜなら、F11を2回(フルスクリーンとノーマルモードに戻って)押したときに、DOMを変更しなくてもスクロールバーが表示されるからです。
おかげで、 hilnius
は__ _ _ ANSWER
は最終的に私は解決策を見つけました。不思議な人には、$ timeoutサービスを使う必要があります。そのように:
myApp.directive('postRender',['$timeout', function (timer) {
return {
link: function (scope, elem, attrs, ctrl) {
timer(function() {
jQuery('.nano').nanoScroller({preventPageScrolling: true})
}
, 0);
}
}
}]);
私は解決策を見つけましたが、そこにあった問題はまだ分かりません。私はそれが角度指示がDOMが完全に修正されるのを待っていなかったので、おそらく時間の心配があったと思う。
「回答」として回答を投稿し、回答としてマークすることをお勧めします。 – BotanMan