AngularJS 在状态加载时加载数据答案

【问题标题】：AngularJS load data on state loadAngularJS 在状态加载时加载数据
【发布时间】：2020-07-21 21:00:10
【问题描述】：

我的 Angular.js 应用程序中有一个页面，它执行 http 请求并用结果填充一些文本框。

我通过使用导航到此页面：

$state.go('utab.history');

但是当它到达页面时，所有文本框都是空白的，我目前正在使用 Ionics 离子刷新器：

<ion-refresher
    pulling-text="Pull to refresh..."
    on-refresh="showappraisal()">
</ion-refresher>

调用控制器函数，然后填充所有文本框，但现在应用程序几乎完成我需要解决这个问题。

我在$state.go('utab.history'); 之前尝试过使用$rootScope.$emit("CallParentMethod", {});，它确实运行了该函数，但同样，它只是不填充文本框，直到我执行拉刷新（即使它们调用相同的函数）。

有没有办法在 utab.history 加载时获取事件？

【问题讨论】：

我认为我们需要更多代码来解决这个问题。比如你如何准确地加载你的数据。

标签： javascript angularjs ionic-framework

【解决方案1】：

在您的视图控制器中添加一个侦听器函数，并根据需要进行更改。

app.controller("yourcontroller", ['$scope', '$ionicView', function($scope, $ionicView){

    $scope.$on('$ionicView.afterEnter', function(e){
        //You can call your functions
    });

});

或

app.controller("yourcontroller", ['$scope', '$ionicView', function($scope, $ionicView){

    $scope.init = function(){
        $scope.$on('$ionicView.afterEnter', function(e){
            //You can call your functions
        });
   }

$scope.init(); //initialize by your own

});

从一个视图导航到另一个视图时，有很多可用的事件。

可用事件：
加载，进入，离开，beforeEnter，beforeLeave，afterEnter，afterLeave，卸载。

为方便起见，您可以收听上述任何事件。

参考：http://ionicframework.com/docs/api/directive/ionView/

【讨论】：

【解决方案2】：

我相信你的问题有点含糊。但如果我理解正确，您可以这样做：

你可以发送一个数据到一个状态

$state.go('myView', { myKey: myData });

并从

访问数据

$stateParams.myKey

另外，不要用任何事件触发get请求事件，你可以使用$ionicView.beforeEnter事件来了解页面何时加载（即使默认情况下Ionic中存在缓存）

【讨论】：

我不想发送数据，当我做 $state.go('utab.history');我希望能够在该控制器中运行一个功能。目前，如果该状态已经打开，它只会将您带到页面。
好吧，$ionicView.beforeEnter 会在每次页面加载时被调用，即使有缓存。
这正是我想要的，非常感谢
没问题。为了社区，请接受我在 StackOverflow 中的回答 :)

【解决方案3】：

 $scope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams) {
      if(toState == 'utab.history')
      {
          // do your stuff
      }
 });

【讨论】：

【解决方案4】：

你可以看看这个。它对我有用。

$state.go($state.current, {}, {reload: true}); //second parameter is for $stateParams

文档：https://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state#methods_reload

Reference

【讨论】：

【解决方案5】：

您可以在控制器的构造函数中调用showappraisal()：

angular.controller('myId', function(){

  this.showappraisal = function() {
    //logic to load data here
  };

  //this will do the call when the controller is created which should happen when the state is started
  this.showappraisal();

});

【讨论】：

你指的是html页面还是状态？
那你为什么要定义一个函数呢？在这种情况下，您可以直接在控制器中编写代码。
代码被放入一个函数中，因为它可以被ion-refresher调用来按需刷新用户的数据。