浏览器重新加载不会重新加载当前的Angular视图

Question

我遇到的问题是，在用户登录或注册后，他们被重定向到游戏视图，这发生在createUser函数内或成功验证后;在任何一种情况下，重定向都由$state.go('games')处理。

但是，如果用户从游戏视图导航到 createGame 或 dashBoard 等任何其他状态，然后刷新其中一个浏览器，则一切正常视图总是重定向回游戏视图。当我删除$state.go('games')时，这不会发生，重新加载只会重新加载当前视图（就像它应该）。

我尝试更改$state.go上的参数并尝试使用$state.transitionTo()，但没有任何更改此行为。

这只是$state.go的正常行为吗？如果没有，我使用它是否错误，还有其他方法可以重定向吗？我该怎么做才能阻止这种行为？

var game = angular.module('game', ['ui.router','firebase']);

game.config(['$stateProvider', '$locationProvider', function($stateProvider,$locationProvider) {
$locationProvider.html5Mode(true);

  $stateProvider.state('signUp', {
   url: '/signUp',
   templateUrl: '/templates/signUp.html'
  });

  $stateProvider.state('games', {
     url: '/games',
     templateUrl: '/templates/games.html',
     controller: 'games.controller'
    });

  $stateProvider.state('login', {
   url: '/login',
   templateUrl: '/templates/login.html'
  });

  $stateProvider.state('dashboard', {
   url: '/dashboard',
   templateUrl: '/templates/dashboard.html',
   controller: 'dashboard.controller'
  });

  $stateProvider.state('createGame', {
   url: '/createGame',
   templateUrl: '/templates/createGame.html',
   controller: 'createGame.controller'
  });

}]);


// Root reference to database
game.factory("Fire", function($firebaseAuth) {
    var ref = new Firebase("https://money-game.firebaseIO.com/");
    return ref;
});

// Gives access to auth methods
game.factory("Auth", ["$firebaseAuth", "Fire",
  function($firebaseAuth, fire) {
    return $firebaseAuth(fire);
  }
]);



game.controller('app.controller', ['$scope', '$state', '$stateParams', 'Auth', 'Fire', function ($scope, $state, $stateParams, auth, fire) {
  $scope.user = {
    email : '',
    password : ''
  };

  $scope.signUp = function() {
    auth.$createUser($scope.user)
    .then(function(userData) {
      // After successful signup save a user record to users under their auth ID
      fire.child('users').child(userData.uid).set({
        name : $scope.user.name,
        email : $scope.user.email,
        joined : Date.now()
      });
      $state.go('games');
      console.log("User " + userData.uid + " created successfully!");
    })
    .catch(function(error) {
      console.error("Error: ", error);
    });
  };
  $scope.login = function() {
    auth.$authWithPassword($scope.user).catch(function(error) {
      console.error("Authentication failed:", error);
    });
  };
  $scope.logout = function() {
    auth.$unauth();
    window.location = '/';
  };

  auth.$onAuth(function(authData) {
    if (authData) {
      $scope.activeUser = authData;

      // After user logs in find user record by auth id
      fire.child('users').child(authData.uid).on('value', function(snapshot) {
        // Checks if user exsists
        if (snapshot.exists()) {
          // sets scope user to the user data
          $scope.user = snapshot.val();
          // sets scope user id to the auth id
          $scope.user.id = snapshot.key();
        }
      });
      console.log("Logged in as:", authData.uid);
      $state.go('games');

    } else {
      $scope.activeUser = false;
      // $scope.user = '';
    }
  });
}]);


game.controller('games.controller', ['$scope', '$state', '$stateParams', 'Auth', '$firebaseArray','Fire', function ($scope, $state, $stateParams, auth, $firebaseArray, fire) {

  $scope.games = $firebaseArray(fire.child('games'));
  $scope.view = 'listView';

  $scope.setCurrentGame = function(game) {
    $scope.currentGame = game;
  };

  $scope.addPlayer = function(game) {
    console.log(game.$id);
    var ref = fire.child('players').child(game.$id);
    ref.push({
      id : $scope.user.id,
      name : $scope.user.name,
      email : $scope.user.email
    })
  };

  // swap DOM structure in games state
  $scope.changeView = function(view){
    $scope.view = view;
  }
}]);

game.controller('createGame.controller', ['$scope', '$state', '$stateParams', 'Auth', '$firebaseArray','Fire', function ($scope, $state, $stateParams, auth, $firebaseArray, fire) {

  $scope.games = $firebaseArray(fire.child('games'));

  $scope.createGame = function() {
    if ($scope.format == 'Match Play') {
      $scope.skinAmount = 'DOES NOT APPLY';
      $scope.birdieAmount = 'DOES NOT APPLY';
    }
    $scope.games.$add({
      name: $scope.gameName,
      host: $scope.user.name,
      date: $scope.gameDate,
      location: {
        course: $scope.courseName,
        address: $scope.courseAddress
      },
      rules: {
        amount: $scope.gameAmount,
        perSkin: $scope.skinAmount,
        perBirdie: $scope.birdieAmount,
        format: $scope.format,
        holes : $scope.holes,
        time: $scope.time
      }
    })
    // $state.go('games');
  };
}]);

Answer 1

这不是关于$ state.go

实际上，当你调用它时，$ state.go做了一件简单的事情：触发应用程序中路由状态的更改。每当您的应用程序在$ onAuth处理程序中针对$ firebaseAuth服务对您的用户进行身份验证时，您就会碰巧这样做。

单页应用是一个应用

当您在浏览器中刷新页面时，整个应用程序会重新加载，再次启动，提升所有内容以显示您的应用。这个启动过程包括重新验证你的用户（我没有看到你的代码在哪里完成，但已经完成），从而再次触发$ onAuth处理程序......并最终执行$ state.go（'games'）再次。

将$ state.go调用放在其他地方

每当您的应用对用户进行身份验证时，您实际上并不是意味着，而是在用户执行成功登录或注册操作时想要这样做。 $ authWithPassword返回一个promise，你可以在解析promise时成功回调状态。

希望有所帮助！