ここでは、Angular.jsのWeb APIからデータを取得するために "$ http.get"リクエストを使用しています。同じウェブAPIを使用してデータを取得および追加する方法Angularjsでリクエストを取得する
API URLにはパラメータ呼び出し「pageNo =」があり、リクエストの負荷が高くなるように各ページ番号のデータを取得するには、そのパラメータの最後に数字を追加する必要があります。
私はスコープ変数($ scope.pageCount)をとり、それをURLと一緒に渡しました。正常に動作しており、レコードのリストを一度に取得できました。
ここでは、スクロールダウン(無限スクロールのように)の残りのデータを取得し、それに既存のデータリストを追加すると仮定します。
同じリクエストからさらに多くのデータを取得することは可能ですか? アプリケーションに「無限スクロール」を追加し、スクロールダウン時に警告を受け取りました。
現在の作業関数は次のとおりです。
app.controller('SpotLightCtrl', function ($scope, $http, shareEventID) {
$scope.pageCount = 1;
$http.get("https://stg.myapi.svc/pageNo="+$scope.pageCount+)
.then(function (response) {
$scope.data = response.data;
$scope.loadMore = function() {
alert('Load more records');
};
});
});
HTMLコード:
<div class="content-block spotlight-listing" ng-controller="SpotLightCtrl" infinite-scroll='loadMore()' infinite-scroll-distance='1'>
<h1>Spotlight</h1>
<div ng-repeat="event in data.eventList" class="deals-block">
<div class="col-md-4 col-xs-12 img-style">
<a href="/SpotLight-Detail"><img ng-src="{{event.eventPosterImage}}" class="img-responsive img-rounded" /></a>
</div>
</div>
</div>
任意の詳細は明らかでない場合は共有してください、すべてのヘルプは...
に追加され呼び出されたとき、私はあなたがチェック示唆それを修正してください。 – George
ああ、私は – Ajoshi
右ジョージをチェックさせ、同じものを更新しました。 – Ajoshi