ダッシュボード Web アプリでangularjs 無限スクロールを使用しています。複数の無限スクロール可能なウィジェットを保持する単一のページがあります。それぞれに無限スクロールが必要なので、このディレクティブを使用することにしましたが、どういうわけか期待どおりに機能しません。メインブラウザウィンドウの代わりに完全なスクロールバーを使用する内部コンテンツdivスクロールバーに対して無限スクロールが機能するようにします。Google で検索したところ、デフォルトの動作を変更するために使用できる 2 つの新しい変数、infinite-scroll-containerとinfinite-scroll-parentを説明する複数のスレッドが見つかりました。私は両方を試しましたが、どちらも私のために働いていません。perfect-scrollbar の使用が問題を引き起こしていると思います。
翡翠コード:
.hor-col(ng-repeat="stream in socialStreams")
.box-body(style='min-height: 400px;')
perfect-scrollbar.timeline-scroller(wheel-propagation="true" wheel-speed="1" min-scrollbar-length="8" suppressScrollX="true" id="streamScroll-{{$index}}")
div(infinite-scroll="loadMorePosts(stream['streamId'], stream['endCursor'])", infinite-scroll-disabled="stream['infiniteScrollDisabled']", infinite-scroll-container="'#streamScroll-{{$index}}'")
複数のウィジェットがあるため、infinite-scroll-container に同じ ID またはクラスを使用できないため、動的 ID を生成することにしました。
infinite-scroll-container 内に動的クラスを挿入するにはどうすればよいですか?
次のエラーが表示されます。
エラー: 'Document' で 'querySelector' を実行できませんでした: '#streamScroll-{{$index}}' は有効なセレクターではありません。
PS次のスレッドを見ましたが、私の要件をカバーしているものはありませんでした: