應用程序不會顯示所有項目（Ionic，Backand）

Question

我是Java的新手，這是我第一個使用Ionic的項目。我想製作一個應用程序來顯示一些項目，所以我找到了背景和模板（https://market.ionic.io/starters/backand-simple）並使用它。我的數據庫中有大約40個項目，但該應用只顯示前20個項目。

我希望你能幫我解決我的問題。

非常感謝，

克勞斯

我controller.js

angular.module('SimpleRESTIonic.controllers', []) 

.controller('LoginCtrl', function (Backand, $state, $rootScope, LoginService) { 
    var login = this; 

    function signin() { 
     LoginService.signin(login.email, login.password) 
      .then(function() { 
       onLogin(); 
      }, function (error) { 
       console.log(error) 
      }) 
    } 

    function onLogin(){ 
     $rootScope.$broadcast('authorized'); 
     login.email = ''; 
     login.password = '';    
     $state.go('tab.dashboard'); 
    } 

    function signout() { 
     LoginService.signout() 
      .then(function() { 
       //$state.go('tab.login'); 
       login.email = ''; 
       login.password = ''; 
       $rootScope.$broadcast('logout'); 
       $state.go($state.current, {}, {reload: true}); 
      }) 

    } 

    login.signin = signin; 
    login.signout = signout; 
}) 

.controller('DashboardCtrl', function (ItemsModel, $rootScope) { 
    var vm = this; 

    function goToBackand() { 
     window.location = 'http://docs.backand.com'; 
    } 

    function getAll() { 
     ItemsModel.all() 
      .then(function (result) { 
       vm.data = result.data.data; 
      }); 
    } 

    function clearData(){ 
     vm.data = null; 
    } 

    function create(object) { 
     ItemsModel.create(object) 
      .then(function (result) { 
       cancelCreate(); 
       getAll(); 
      }); 
    } 

    function update(object) { 
     ItemsModel.update(object.id, object) 
      .then(function (result) { 
       cancelEditing(); 
       getAll(); 
      }); 
    } 

    function deleteObject(id) { 
     ItemsModel.delete(id) 
      .then(function (result) { 
       cancelEditing(); 
       getAll(); 
      }); 
    } 

    function initCreateForm() { 
     vm.newObject = {name: '', description: ''}; 
    } 

    function setEdited(object) { 
     vm.edited = angular.copy(object); 
     vm.isEditing = true; 
    } 

    function isCurrent(id) { 
     return vm.edited !== null && vm.edited.id === id; 
    } 

    function cancelEditing() { 
     vm.edited = null; 
     vm.isEditing = false; 
    } 

    function cancelCreate() { 
     initCreateForm(); 
     vm.isCreating = false; 
    } 

    vm.objects = []; 
    vm.edited = null; 
    vm.isEditing = false; 
    vm.isCreating = false; 
    vm.getAll = getAll; 
    vm.create = create; 
    vm.update = update; 
    vm.delete = deleteObject; 
    vm.setEdited = setEdited; 
    vm.isCurrent = isCurrent; 
    vm.cancelEditing = cancelEditing; 
    vm.cancelCreate = cancelCreate; 
    vm.goToBackand = goToBackand; 
    vm.isAuthorized = false; 

    $rootScope.$on('authorized', function() { 
     vm.isAuthorized = true; 
     getAll(); 
    }); 

    $rootScope.$on('logout', function() { 
     clearData(); 
    }); 

    if(!vm.isAuthorized){ 
     $rootScope.$broadcast('logout'); 
    } 

    initCreateForm(); 
    getAll(); 

}); 

我services.js

angular.module('SimpleRESTIonic.services', []) 

.service('APIInterceptor', function ($rootScope, $q) { 
    var service = this; 

    service.responseError = function (response) { 
     if (response.status === 401) { 
      $rootScope.$broadcast('unauthorized'); 
     } 
     return $q.reject(response); 
    }; 
}) 

.service('ItemsModel', function ($http, Backand) { 
    var service = this, 
     baseUrl = '/1/objects/', 
     objectName = 'items/'; 

    function getUrl() { 
     return Backand.getApiUrl() + baseUrl + objectName; 
    } 

    function getUrlForId(id) { 
     return getUrl() + id; 
    } 

    service.all = function() { 
     return $http.get(getUrl()); 
    }; 

    service.fetch = function (id) { 
     return $http.get(getUrlForId(id)); 
    }; 

    service.create = function (object) { 
     return $http.post(getUrl(), object); 
    }; 

    service.update = function (id, object) { 
     return $http.put(getUrlForId(id), object); 
    }; 

    service.delete = function (id) { 
     return $http.delete(getUrlForId(id)); 
    }; 
}) 

.service('LoginService', function (Backand) { 
    var service = this; 

    service.signin = function (email, password, appName) { 
     //call Backand for sign in 
     return Backand.signin(email, password); 
    }; 

    service.anonymousLogin= function(){ 
     // don't have to do anything here, 
     // because we set app token att app.js 
    } 

    service.signout = function() { 
     return Backand.signout(); 
    }; 
}); 

我的儀表盤選項卡//其中顯示的項目

<ion-view view-title="Produkte"> 
<div ng-if="!vm.isCreating && !vm.isEditing"> 
    <ion-content class="padding has-header"> 
     <!-- LIST --> 
     <div class="bar bar-header bar-balanced"> 
      <span ng-click="vm.isCreating = true"><i class='icon ion-plus-round new-item'> Erstellen</i></span> 
     </div> 
      <div class="bar bar-subheader"> 
       <div class="list card" ng-repeat="object in vm.data" 
        ng-class="{'active':vm.isCurrent(object.id)}"> 
         <div class="item item-icon-right item-icon-left"> 
          <i class="ion-compose icon" ng-click="vm.setEdited(object)"></i> 

          <h2 class="text-center"><b>{{object.name}}</b></h2> 
          <i class="icon ion-close-round" ng-click="vm.delete(object.id)"></i> 
         </div> 
          <div class="text-center"> 
           {{object.description}} 
          </div> 
          <div class="item item-body"> 
           <p style="text-align:center;"><img src="{{object.imgurl}}" style="max-width: 250px; max-height: 250px" /></p> 
          </div> 
          <div class="text-center"> 
           {{object.price}} Euro 
          </div> 
       </div> 
      </div> 
    </ion-content> 
</div> 
<div ng-if="vm.isCreating"> 
    <ion-content class="padding has-header"> 
     <!-- Erstellen --> 
     <div class="bar bar-header"> 
      <h2 class="title">Erstelle ein Produkt</h2> 
      <span ng-click="vm.cancelCreate()" class="cancel-create">Abbruch</span> 
     </div> 
     <div class="bar bar-subheader"> 
      <form class="create-form" role="form" 
        ng-submit="vm.create(vm.newObject)" novalidate> 
       <div class="list"> 
        <label class="item item-input item-stacked-label"> 
         <span class="input-label">Name</span> 
         <input type="text" class="form-control" 
           ng-model="vm.newObject.name" 
           placeholder="Gib einen Namen ein"> 
        </label> 
        <label class="item item-input item-stacked-label"> 
         <span class="input-label">Beschreibung</span> 
        <textarea placeholder="Beschreibung" class="form-control" 
           ng-model="vm.newObject.description"></textarea> 
        </label> 
        <label class="item item-input item-stacked-label"> 
         <span class="input-label">Preis</span> 
         <textarea placeholder="Preis" class="form-control" 
            ng-model="vm.newObject.price" 
            typeof="float"></textarea> 
        </label> 
        <label class="item item-input item-stacked-label"> 
         <span class="input-label">Bild</span> 
         <input type="text" class="form-control" 
           ng-model="vm.newObject.imgurl" 
           placeholder="Gib einen Bildlink ein"> 
        </label> 
       </div> 
       <button class="button button-block button-balanced" type="submit">Fertig</button> 
      </form> 
     </div> 
    </ion-content> 
</div> 
<div ng-if="vm.isEditing && !vm.isCreating"> 
    <ion-content class="padding has-header"> 
     <!-- Bearbeiten --> 
     <div class="bar bar-header bar-secondary"> 
      <h1 class="title">Bearbeiten</h1> 
      <span ng-click="vm.cancelEditing()" class="cancel-create">Abbrechen</span> 
     </div> 
     <div class="bar bar-subheader"> 
      <form class="edit-form" role="form" 
        ng-submit="vm.update(vm.edited)" novalidate> 
       <div class="list"> 
        <label class="item item-input item-stacked-label"> 
         <span class="input-label">Name</span> 
         <input type="text" class="form-control" 
           ng-model="vm.edited.name" 
           placeholder="Gib einen Namen ein"> 
        </label> 
        <label class="item item-input item-stacked-label"> 
         <span class="input-label">Beschreibung</span> 
       <textarea class="form-control" 
          ng-model="vm.edited.description" 
          placeholder="Beschreibung"></textarea> 
        </label> 
        <label class="item item-input item-stacked-label"> 
         <span class="input-label">Preis</span> 
         <textarea placeholder="Preis" class="form-control" 
            ng-model="vm.edited.price" 
            type="float"></textarea> 
        </label> 
        <label class="item item-input item-stacked-label"> 
         <span class="input-label">Bild</span> 
         <textarea class="form-control" 
            ng-model="vm.edited.imgurl" 
            placeholder="Bildlink"></textarea> 
        </label> 
        <label class="item item-input item-stacked-label"> 
         <span class="input-label">Auswählen</span> 
         <textarea class="form-control" 
            ng-model="vm.edited.check" 
            placeholder="true" type="boolean"></textarea> 
        </label> 
       </div> 
       <button class="button button-block button-balanced" type="submit">Speichern</button> 
      </form> 
     </div> 
    </ion-content> 
</div> 

Answer 1

感謝您使用Backand！您可以在getList（）調用中修改默認頁面大小過濾器。它在我們的新SDK中可用 - 如果您更新到您下載的最新版本的初學者項目，它應該已經有適當的內置修改。作爲參考，我們的新SDK可以在https://github.com/backand/vanilla-sdk

關於解決你的問題，爲了調整頁面大小，你可以傳入一個額外的參數給getList函數，動態改變你可以檢索的記錄數。下面是你的使用情況相符一些示例代碼：

service.all = function() { 
    params = { pageSize: 100 }; // Changes page size to 100 
    return Backand.object.getList('items', params); 
}; 

使用舊的SDK，你可以通過附加參數查詢參數來使用來驅動你的GET請求的URL類似的東西。