如何让我的角控制器重新加载数据

How to get my angular controller to reload data

本文关键字:加载 数据 新加载 我的 控制器      更新时间:2023-09-26

我有一个有三个视图的angular应用程序。当它加载时,它运行一些代码来填充$scope变量。当我改变视图,然后回到控制器时,我想让初始代码再次运行,但它没有。它似乎是缓存的,$scope变量没有根据发生的事情更新。

如何在每次加载视图时强制控制器运行初始化代码?

我的路线:

app.config(function ($routeProvider) {
  $routeProvider
    .when('/', {
        controller: 'HomeController',
        templateUrl: 'home.html'
    })
    .when('/teach', {
      controller: 'TeachController',
      templateUrl: 'teach.html'
    })
    .otherwise({
        redirectTo: '/'
    });
});

我想在每次点击'/'路由时运行的代码:

getSubPools.success(function(data) {
  $scope.userPools = data;
});

控制器完整:

app.controller('HomeController', ['$scope', '$filter', 'stream', 'removeDroplet', 'qrecords', 'helps', 'get_user', 'updateRecords', 'getSubPools', function($scope, $filter, stream, removeDroplet, qrecords, helps, get_user, updateRecords, getSubPools) {
  get_user.success(function(data) { //get current user
    $scope.user = data;
  });
  getSubPools.success(function(data) {
    $scope.userPools = data;
  });
  stream.success(function(data) {
    $scope.stream = data;
    if ($scope.stream.length === 0) { //determine if user has stream
      $scope.noStream = true;
    } else {
      $scope.noStream = false;
    }
    $scope.getNumberReady(); //determine if any droplets are ready
    if ($scope.numberReady === 0){
      $scope.noneReady = true;
    } else {
      $scope.noneReady = false;
      $scope.stream = $filter('orderBy')($scope.stream, 'next_ready'); //orders droplets by next ready
    }
  });
    $scope.showEditStream = true;
    $scope.showStream = false;
    $scope.rightAnswer = false;
    $scope.wrongAnswer = true;
    $scope.noneReady = false;
    $scope.subbedDroplets = [];
    $scope.focusInput = false;
}]);

你可以使用$routeChangeStart和$ routechangessuccess事件来重新加载数据到控制器中:

https://docs.angularjs.org/api/ngRoute/service/美元路线

编辑:正如mohan所说,这将适用于每次路由更改,您可以创建一个服务来捕获这些事件,并为每条路由广播一个特殊事件。

在相关的控制器/服务中监听这个事件并重新加载数据

如果你想强制重载,那么添加一个点击函数,如下所示

注意:这只会在你使用$stateProvider

时起作用
<a href="" ng-click="goToHome()">Home</a>

和控制器

$scope.goToHome = function(){
    $state.transitionTo('home', {}, {reload:true});
}

这里的问题是,点击链接到'/'并不是所有的初始化代码都在重新运行。angular只是返回旧数据,而不是调用数据库来获取新数据。我解决这个问题的方法是重写我的工厂。将失败的工厂写为:

app.factory('stream', ['$http', function($http) {
  return $http.get('/stream/')
  .success(function(data) {
    return data;
  })
  .error(function(err) {
    return err;
  });
}]);

每次工作的工厂写:

app.factory('stream', ['$http', function($http) {
  return {
    fetch: function () {
      return $http.get('/stream/');
    }
  }
}]);

现在它每次都运行。我不知道为什么。