2017-02-15 4 views
1

Я новичок в Java, и это мой первый проект с Ionic. Я хочу создать приложение, которое отображает некоторые элементы, поэтому я нашел шаблон backand (https://market.ionic.io/starters/backand-simple) и использовал его. У меня около 40 элементов в моей базе данных, но в приложении отображаются только первые 20 элементов.App wan't показать все элементы (Ionic, Backand)

Надеюсь, вы можете помочь мне с моей проблемой.

Большое спасибо,

Клаус

моего 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> 

ответ

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, вы можете сделать что-то подобное, присоединив параметры параметров запроса в URL, который используется для привода вашего запроса GET.

+0

Благодарим вас за быстрый ответ. Обновление моего SDK не сработало для меня. Я думаю, что что-то не так. BUT Я решил проблему с добавлением «params = 'items? PageSize = 100 & pageNumber = 1';" под var в services.js и добавление новой функции и редактирование service.all. –

+0

Отлично, рад, что вы смогли это исправить. Если у вас возникнут проблемы с новым SDK, возможно, я смогу помочь - я буду рад поговорить по электронной почте (это в моем профиле) или настроить видеовызов. –

Смежные вопросы