在 Angular 中，如何使用 $location.path 作为 $http.post 成功回调进行重定向

Posted 2023-02-24

【中文标题】在 Angular 中，如何使用 $location.path 作为 $http.post 成功回调进行重定向

【英文标题】：In Angular, how to redirect with $location.path as $http.post success callback

【发布时间】：2012-12-27 09:56:20

【问题描述】：

我正在尝试通过将 Post 发送到 php 文件来创建一个简单的身份验证服务，我需要它在成功时加载我的 ng-view 上的部分主页。

这是我尝试过的：

function loginCtrl($scope, $http, $location)
    $http.post(url,data).success(function(data)
        $location.path('/home');
    );

导致我的网址发生变化，但 ng-view 未更新。当我手动刷新页面时它会更新。

（路由已在$routeProvider 正确配置，我已经测试了使用独立函数重定向它而不是作为回调并且它有效）

我也尝试将$location.path('/home') 定义为一个函数，然后在回调中调用它仍然不起作用。

我做了一些研究，发现一些文章指出使用另一个第三方插件时会发生这种情况，我只加载 angular.js

对某些学习材料的任何见解或指示都会很棒

【问题讨论】：

ng-view 是什么意思？另外，$location.path() 是否在内部调用 window.location = ...？

我忘了提到这是在使用 angularjs 框架的上下文中。 - 编辑以上内容

有趣！你用萤火虫之类的吗？当路由更改时，您的应用是否会请求部分请求？

尝试在 $location.path('/home') 之后调用 $rootScope.$apply()。

@GeorgeAnandaEman，顺便说一句，你看到这个帖子了吗：***.com/questions/11784656/…？我打赌“是”，但以防万一。

【参考方案1】：

这是本文http://www.yearofmoo.com/2012/10/more-angularjs-magic-to-supercharge-your-webapp.html#apply-digest-and-phase中的changeLocation示例

//be sure to inject $scope and $location
var changeLocation = function(url, forceReload) 
  $scope = $scope || angular.element(document).scope();
  if(forceReload || $scope.$$phase) 
    window.location = url;
  
  else 
    //only use this if you want to replace the history stack
    //$location.path(url).replace();

    //this this if you want to change the URL and add it to the history stack
    $location.path(url);
    $scope.$apply();
  
;

【讨论】：

您可能应该使用 $window 服务而不是直接使用 window 对象以避免测试时出现问题。 code.angularjs.org/1.1.5/docs/api/ng.$window

一个功能外的答案：使用 $window.location = url;

我还写了一个单独的回溯历史堆栈

app.directive("backButton", function ($window) return restrict: "A", link: function (scope, elem, attrs) elem.bind("click", function () $window.history.back(); ); ; );

【参考方案2】：

官方指南中有简单的答案：

它没有做什么？

更改浏览器 URL 时不会导致整个页面重新加载。 要在更改 URL 后重新加载页面，请使用较低级别的 API， $window.location.href。

来源：https://docs.angularjs.org/guide/$location

【参考方案3】：

我正在执行以下页面重定向（从登录到主页）。我还必须将用户对象传递给主页。所以，我正在使用 Windows 本地存储。

    $http(
        url:'/login/user',
        method : 'POST',
        headers: 
            'Content-Type': 'application/json'
          ,
        data: userData
    ).success(function(loginDetails)
        $scope.updLoginDetails = loginDetails;
        if($scope.updLoginDetails.successful == true)
            
                loginDetails.custId = $scope.updLoginDetails.customerDetails.cust_ID;
                loginDetails.userName = $scope.updLoginDetails.customerDetails.cust_NM;
                window.localStorage.setItem("loginDetails", JSON.stringify(loginDetails));
                $window.location='/login/homepage';
            
        else
        alert('No access available.');

    ).error(function(err,status)
        alert('No access available.');      
    );

它对我有用。

【参考方案4】：

我没有使用success，而是将其更改为then，它可以工作。

代码如下：

lgrg.controller('login', function($scope, $window, $http) 
    $scope.loginUser = ;

    $scope.submitForm = function() 
        $scope.errorInfo = null

        $http(
            method  : 'POST',
            url     : '/login',
            headers : 'Content-Type': 'application/json'
            data: $scope.loginUser
        ).then(function(data) 
            if (!data.status) 
                $scope.errorInfo = data.info
             else 
                //page jump
                $window.location.href = '/admin';
            
        );
    ;
);

【参考方案5】：

使用：$window.location.href = '/Home.html';

【参考方案6】：

代码很简单..但很难罚款..

detailsApp.controller("SchoolCtrl", function ($scope, $location)  
      $scope.addSchool = function () 

        location.href='/ManageSchool/TeacherProfile?ID=' + $scope.TeacherID;
      
);