Приложение не отображает все элементы (Ionic, Backand)

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

мой контроллер.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();

});

мои услуги.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>


person Klaus Hasleder    schedule 15.02.2017    source источник


Ответы (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.

person Matt Billock    schedule 15.02.2017
comment
Спасибо за быстрый ответ. Обновление моего SDK не помогло мне. Я думаю, что сделал что-то не так. НО я решил проблему, добавив params = 'items?pageSize=100&pageNumber=1'; под var в services.js и добавление новой функции и редактирование service.all. - person Klaus Hasleder; 16.02.2017
comment
Отлично, рад, что у вас получилось. Если у вас возникли проблемы с новым SDK, возможно, я смогу помочь — я был бы рад поговорить по электронной почте (которая есть в моем профиле) или организовать видеозвонок. - person Matt Billock; 16.02.2017