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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/14301524/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 16:19:35  来源:igfitidea点击:

In Angular, how to redirect with $location.path as $http.post success callback

javascriptmodel-view-controllerangularjs

提问by George Ananda Eman

I am attempting to make a simple authentication service by sending a Post to a php file, I need it to load the home page partial on my ng-viewwhen its successful.

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

This is what I tried :

这是我试过的:

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

Results in my url changing but ng-viewnot updating. It updates when I manually refresh the page.

导致我的 url 更改但未ng-view更新。当我手动刷新页面时它会更新。

(routes have been configured properly at the $routeProvider, I have tested redirecting this with a standalone function not as a callback and it works )

(路由已经在 中正确配置$routeProvider,我已经测试了使用独立函数重定向它而不是作为回调并且它可以工作)

I have also tried defining $location.path('/home')as a function and then calling it on the callback it still doesn't work.

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

I did some research and found some articles stating this happens when using another third party plugin, I am only loading angular.js

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

Any insights or pointers to some study material will be great

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

回答by Mark Nadig

Here is the changeLocation example from this article http://www.yearofmoo.com/2012/10/more-angularjs-magic-to-supercharge-your-webapp.html#apply-digest-and-phase

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

//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();
  }
};

回答by 0x6B6F77616C74

There is simple answer in the official guide:

官方指南中有一个简单的答案:

What does it not do?

It does not cause a full page reload when the browser URL is changed. To reload the page after changing the URL, use the lower-level API, $window.location.href.

它不做什么?

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

Source: https://docs.angularjs.org/guide/$location

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

回答by user2230867

I am doing the below for page redirection(from login to home page). I have to pass the user object also to the home page. so, i am using windows localstorage.

我正在执行以下页面重定向(从登录到主页)。我还必须将用户对象传递到主页。所以,我正在使用 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.');      
    });

And it worked for me.

它对我有用。

回答by jcguo

Instead of using success, I change it to thenand it works.

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

here is the code:

这是代码:

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';
            }
        });
    };
});

回答by jcguo

Use : $window.location.href = '/Home.html';

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

回答by isanka thalagala

it's very easy code .. but hard to fined..

这是非常简单的代码..但很难罚款..

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

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