問題タブ [ui-scroll]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - ng-scroll と ng-repeat を使用した AngularJS
angular-ui を angular で使用する。ng-scroll
マークアップには、サービスから取得したデータを操作した要素が含まれています。アイテムの行を作成したいのでng-repeat
、ng-scroll
. これは原則として機能します ( plunker ) が、AngularJS は、JSON エンコーディングに何か問題があり、何が間違っているのかを理解するのに助けが必要だと言っています。
明確にするために、以下のマークアップと JSON は plunker では機能しますが、アプリでは機能しません。plunker 以下の JSON は、デバッガーの応答本文から取得されます。
マークアップ:
JSON:
Rails では、配列の配列を作成します。各要素は、上記の表示コードで使用するプロパティのハッシュです。返される JSON は次のようになります。
これが機能しない理由がわからない場合、ng-scroll は配列を video_list に入れて行を反復する必要があり、ng-repeat は行から各オブジェクトを取得して値を取得する必要があります。
エラー:
これは、上記の JSON が返されたときに表示される AngularJS エラーです。
javascript - angular-ui > ui-utils > ui-scroll が機能しない (v. 0.1.0)
私はこれを使用しています: http://angular-ui.github.io/ui-utils/より具体的にはこれを使用しています: https://github.com/angular-ui/ui-utils/blob/master/modules/ scroll/README.md
しかし、うまくいかないようです。次に例を示します。
しかし、HTMLで取得するのはこれだけです:
ng-scroll を ng-repeat に置き換えると、完全に機能します。しかし、チャットにはスクロール バーが必要なので、どうすれば取得できますか? :)
javascript - AngularJS ui-utils ui.scroll に結果が表示されない
AngularJS を使用した Rails 4 アプリケーションがあります。angular の ui-utils モジュールの ui.scroll ディレクティブを使用してプロトタイプを作成しようとしています。Rails API は ng-repeat を使用するとうまく機能しますが、ng-scroll を使用しようとすると、ビューポートにデータがありません。注: アプリの他の部分で jquery を使用しているため、jqlite は使用していません。
表示: (すべてのヘッダーをスキップしていますが、css/jscript が含まれていることは知っています)
コントローラー: (すべてのアプリのインクルージョンをスキップしていますが、依存関係が注入されていることはわかっています)
angularjs - Angularjs ui-utils ui-scroll 使い方
ui-scroll の使い方がよくわかりません。plunker を作成しましたが、スクロール時に DOM にアイテムを追加または削除していないため、正しく機能していないと思います。それはそれらすべてを表示します!
Github でいくつかの例を見ましたが、ほとんどのコードはコーヒー スクリプトであり、ループ内のアイテムを DOM に追加するだけです。私の質問は、データが既に正しくある場合、どのようにアイテムを追加するかです。データセットを反復処理する必要はありますか?
あなたの助けに感謝します。
javascript - Angular-ui Scroll のフィルタリング
シンプルなグリッドに無限タイプのスクロールを実装しようとしています。Html は次のようになります。
検索ボックス モデルに基づいてグリッド内にあるものをフィルター処理したいのですが、単純に思えます。私は通常、ng-repeatで次を使用します
ただし、ng-repeat の代わりに「ui-scroll」を使用すると、エラーが発生します
Angular-ui スクロールを使用してデータをフィルター処理する方法が不足していますか? それ以外の場合にエラーをスローする問題を引き起こしているスクロールライブラリの行が表示されます
これは、Angular-ui スクロールではフィルタリングができないと思わせます。アイデアはありますか?
angularjs - angular-ui ui-scroll が非表示の div に読み込まれないようにします
ng-show でデフォルトで非表示になっている div に angular-ui ui-scroll ディレクティブ (1.3.0) があります。非表示の場合、ui-scroll-viewport の高さが設定されていても、ui-scroll はデータソースからデータをロードし続けます。div が表示されている場合、正しく動作します。だから、今のところ私のdivは幅1pxです:/
これを ng-if で解決して、これを DOM に動的に追加できると確信しています。しかし、私はdivをレスポンシブに非表示/表示したかったので、cssから追い出されました。
非表示のときに ui-scroll がバッファから 1 ページのみをロードする方法について何か提案はありますか? ありがとうございました。
angularjs - AngularJs ui-scroll reload が機能しない
Angular アプリケーションの 1 つで、遅延読み込みにui-scrollディレクティブを使用しています。アダプターを作成し、ui-scroll ディレクティブに割り当てました。API リクエストを作成してデータを更新して、データ全体をリロードする必要があります。
ui-scroll docs から、ディレクティブに割り当てているアダプターで使用できる reload() メソッドを確認できます。
このアダプターをカスタム データソースに渡し、それを ui-scroll リピーターに割り当てます。
ユーザーがボタンをクリックすると、API から最新の結果を取得して結果全体をリロードする必要があります。だから私は追加してみました、
reload メソッドを呼び出そうとすると、メソッドが見つからないという例外がスローされます。 TypeError: $scope.listAdapter.reload は関数ではありません
また、データソースを再割り当てし、空のアダプターをスコープ変数に渡してみましたが、うまくいきませんでした。
誰かがこれを修正した場合は、何をする必要があるか教えてください。
angularjs - 自分のデータで「ui-scroll」を使用するにはどうすればよいですか?
アプリケーションで無限スクロール機能を作成しようとしていますが、少し抽象的です。私はui-scrollを使用したいのですが、このフィドルはそれがどのように機能するかの簡単な例を示しています。
私は readme を読み、いくつかの例を調べました。また、その例をプロジェクトに統合して動作させましたが、これを自分のデータベースのデータと組み合わせる方法がわかりません。
私は映画と呼ばれるデータベーステーブルを持っています。ムービーには、title
、release_date
、image_url
$scope.movieDataSource
ビューで使用できるように、そのデータを に挿入するにはどうすればよいですか?
私が得ようとしているものの例を作成しようとしました。http.get を使用してuserMovies
スコープにデータベースのレコードを入力し、それらのレコードを の項目として使用したいと考えていますmovieDataSource
。
しかし、ページにアクセスするui-scroll
と、コンテナに結果が追加されますが、コンテンツは表示されません。
私ならconsole.log("movieDataSource" + $scope.movieDataSource)
それは私を示していますmovieDataSource[object Object]
。
angularjs - Angular UI-Scroll を使用してリストの一番上に項目を追加する
Angular UI scrollを使用してい ます。私がフォローしている例はこれです。ここにデモページがあります。特定の位置にリスト項目を追加する機能があります。以下はコードの抜粋です。
この関数は、3 番目にリスト項目を追加します。ただし、これを使用して要素を一番上 (つまり、リストの一番上) に追加することはできません。scope.$index == 0
の代わりに入れてみましscope.$index == 2
た。を使用するscope.$index == 1
と、2 番目の位置に要素が追加されます。ui-scroll にも prepend 関数がありますが、それを使用してアイテムを常にリストの一番上に追加する方法がわかりません。新しく追加されたアイテムは、常に位置 1 にある必要があります。
どんな提案でも大歓迎です。