离子 - 调用REST服务(工厂)后不刷新离子内容

时间:2015-01-27 13:34:51

标签: angularjs rest ionic-framework

我是离子框架的新手。 我正在浏览器中运行该应用程序。 我打电话给工厂服务后遇到了问题。模板未刷新其内容。 最奇怪的是,当我调整浏览器大小时,我能够看到内容(图像)。

这是我的控制器:

    angular.module('Tijeras.controllers').controller('PromocionesCtrl', function($scope, categoriaService, $ionicPopup, $ionicLoading) {

    $scope.items = [];

    $scope.promocionDetalle = function(id) {
        $ionicPopup.alert({
            title: id
        });
    };

    function getPromociones() {

        $ionicLoading.show({
            template: 'Loading...'
        });

        categoriaService.getCategoriaByID(1)
            .success(function(data, status, headers, config) {

                $ionicLoading.hide();
                $scope.items = data;
                $scope.$apply();
            })
            .error(function(data, status, headers, config) {
                $ionicPopup.alert({
                    title: "Error, no se pudo invocar el servicio"
                });
                $ionicLoading.hide();
            });
    };

    function init() {
        getPromociones();
    };

    init();
});

我的工厂

var TijerasApp = angular.module('TijerasApp');

TijerasApp.factory('categoriaService', function($http){
    return {
        getCategoriaByID: function(id, callback){
            return $http.get('http://192.168.1.9:8080/CategoriaService/categoria/1');
        }
    }
});

模板

<ion-view view-title="Promociones">
<ion-pane>
    <ion-slide-box>
        <ion-slide ng-repeat="item in items">
            <ion-content>
                <img class="img-responsive" src="{{item.image}}" ng-click="promocionDetalle({{item.id}})">
            </ion-content>
        </ion-slide>
    </ion-slide-box>
</ion-pane>

REST调用的结果如下:

[{
    id: 5443544353,
    rootCategory: 3,
    image: "img/promociones/fashion1.jpg",
    text: "shampoos rehidratantes",
    description: "/promociones/fashion1.jpg"
}, {
    id: 2321312,
    rootCategory: 3,
    image: "img/promociones/fashion1.jpg",
    text: "shampoos rehidratantes",
    description: "/promociones/fashion1.jpg"
}]

1 个答案:

答案 0 :(得分:0)

我有类似的问题,不得不使用

$ionicScrollDelegate.$getByHandle('content').scrollTop(false);

用于在对html模板包含滚动委托句柄的服务进行新调用后显示的更新内容:

<ion-content class="has-header" delegate-handle="content" on-scroll="isMaxScrollPosition()">

这会将视图移动到顶部并刷新内容。您可以在http://ionicframework.com/docs/api/service/ $ ionicScrollDelegate /

结帐$ ionicScrollDelegate

我也要从Ionic查看Global Loading Screen with Interceptors上的文章。这样你就不必在每次http调用时调用$ ionicLoading.show / hide。