ionic框架-angularjs子状态,用于获取父状态的数据



我想实现一个子状态,用于将数据获取到主状态。当我处于子状态时,我希望在父状态的视图上显示$ionicLoading内容,并且在加载数据后,它应该离开子状态并返回父状态。如何使用angularjs/ioncframework实现此功能?

我想要分离的状态的控制器看起来像这样:

.controller('MainCtrl', function ($scope, $ionicPopover, $state, $ionicLoading, $ionicPlatform, $q, WebService, DBService) {
  //------ THIS PART SHOULD GO INTO THE CHILD STATE -----//
  $ionicLoading.show({
    template: "Daten werden geladen...",
    animation: "fade-in",
    showBackdrop: false,
    maxWidth: 200,
    showDelay: 500
  });

  $ionicPlatform.ready(function() {
    $ionicPopover.fromTemplateUrl('templates/popover.html', {
      scope: $scope
    }).then(function (popover) {
      $scope.popover = popover;
    });
    DBService.dropTables();
    DBService.createAllTables();
    WebService.getAllTables().then(function(res) {
      $ionicLoading.hide();
      $scope.refreshDestinations();
      //DATA is loaded leave the child state
    }, function(err) {
      $ionicLoading.hide();
      //Change the state to login
      $state.go('app.login');
    });
  });
  //----------- UNTIL HERE  -----------//
  ...
});

作用域是继承的,所以如果您想从子作用域调用父作用域函数,可以。例如:对于离子负载,如果它创建了一个孤立的作用域(可能),您可能必须调用$parent$ionicLoading.show().

<div class="show-scope-demo">
  <div ng-controller="GreetController">
    Hello {{name}}!
  </div>
  <div ng-controller="ListController">
    <ol>
      <li ng-repeat="name in names">{{name}} from {{department}}</li>
    </ol>
  </div>
</div>


 angular.module('scopeExample', [])
    .controller('GreetController', ['$scope', '$rootScope', function($scope, $rootScope) {
      $scope.name = 'World';
      $rootScope.department = 'Angular';
    }])
    .controller('ListController', ['$scope', function($scope) {
      $scope.names = ['Igor', 'Misko', 'Vojta'];
    }]);

最新更新