2015-12-22 17 views
0

我正在創建一個應用程序,並且我添加了ion-footer-bar,問題是ion-footer-bar停留在最後一個記錄上的ion-list的頂部。尋找任何解決方案,我發現使用$scope.$broadcast('scroll.resize');但它沒有解決我的問題。ion-footer-bar留在離子列表上?

enter image description here

我怎麼能解決這個問題?

控制器

var app = angular.module('starter'); 

app.controller('EmpresaCtrl', function($scope, $state, $ionicLoading, EmpresaAPIService, AppConstants, APP_MESSAGES){ 

     $scope.moreData = false; 
     var offset = 0; 
    $scope.items = [];  

    $scope.loadMore = function(){ 
     EmpresaAPIService.getAllEmpresas(offset) 
     .success(function(data){ 
     if(data.result.length === 0){ 
      $scope.moreData = true;    
     }else{    
      angular.forEach(data.result, function(empresa){     
       var image = empresa.Empresa.imagem; 
       empresa.Empresa.imagem = AppConstants.webServiceUrl + "/app/webroot/img/empresas/" + image;     
       $scope.items.push(empresa);   
      }) 
      offset += 10; 
     } 

      $scope.$broadcast('scroll.infiniteScrollComplete'); 
     $scope.$broadcast('scroll.resize'); 

     }) 
     .error(function(err){ 
     $ionicLoading.show({ template: APP_MESSAGES.internetOut, noBackdrop: true, duration: 2000 }); 
     }); 

    }; 

    $scope.getEmpresa = function(id){  
     var params = {id:id}; 
     $state.go('tab.detalheEmp', params); 
    } 

}); 

的index.html

<body ng-app="starter" animation="slide-left-right-ios7"> 

    <ion-nav-bar class="bar bar-header bar-assertive" align-title="center"> 
     <ion-nav-back-button> 
     </ion-nav-back-button> 
    </ion-nav-bar> 

    <ion-nav-view> 
    </ion-nav-view> 

    <ion-footer-bar class="bar-dark" ng-controller="AnuncioCtrl"> 
     <div ng-model="loading" ng-show="loading"> 
      <img src="img/loading.gif" width="30" height="30">    
     </div> 
     <img ng-src="{{banner}}" style="max-width:100%;display:block;margin:0 auto"> 
    </ion-footer-bar> 

    </body> 

empresa.html

<ion-view view-title="Empresas"> 


    <ion-content class="padding" has-footer="true" scroll="true"> 

     <div class="item item-input-inset"> 
      <label class="item-input-wrapper"> 
      <i class="icon ion-ios-search placeholder-icon"></i> 
      <input type="text" ng-model="pesquisar" placeholder="Pesquisa rápida..."> 
      </label> 
     </div> 

     <ion-list>  
      <ion-item class="item item-thumbnail-left" 
       ng-repeat="item in items | filter:pesquisar" 
       type="item-text-wrap" 
       ng-click="getEmpresa({{item.Empresa.id}})" > 

       <img ng-src='{{item.Empresa.imagem}}'>   
       <div style="font-weight:bold;" class="item-text-wrap">{{item.Empresa.nome}}</div> 
       <div style="font-size:small" class="item-text-wrap">{{item.Empresa.tipo}}</div> 
       <div style="font-size:small">{{item.Empresa.endereco}}</div> 
       <div style="font-size:small">{{item.Empresa.telefone}}</div> 

       <a href="tel:{{item.Empresa.telefone}}" class="button button-small button-balanced icon ion-ios-telephone"> 
       </a> 

      </ion-item> 
      <ion-infinite-scroll on-infinite="loadMore();" distance="1%" ng-if='!moreData'></ion-infinite-scroll> 
    </ion-list> 


    </ion-content> 

</ion-view> 

回答

2

解決了proble米它很容易解決。我在標籤<ion-nav-view class="has-footer">上添加課程,並且像魅力一樣工作。

+0

我也在ion2中有同樣的問題我試圖用ion-nav替換但不能使用你能否通過你完整的頁腳代碼 –