Usando $ ventana o $ ubicación para redireccionar en AngularJS

90

La aplicación en la que estoy trabajando contiene varios estados (usando ui-router), donde algunos estados requieren que inicies sesión, otros están disponibles públicamente.

He creado un método que verifica válidamente si un usuario está conectado, con lo que tengo problemas actualmente es redirigir a nuestra página de inicio de sesión cuando sea necesario. Cabe señalar que la página de inicio de sesión no se encuentra actualmente dentro de la aplicación AngularJS.

app.run(function ($rootScope, $location, $window) {


    $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {

        if (toState.data.loginReq && !$rootScope.me.loggedIn) {
            var landingUrl = $window.location.host + "/login";
            console.log(landingUrl);
            $window.open(landingUrl, "_self");
        }
    });
});

Console.log muestra la URL deseada correctamente. La línea posterior a eso, he intentado prácticamente todo, desde $ window.open a window.location.href y no importa lo que haya intentado, no ocurre ninguna redirección.

EDITAR (RESUELTO):

Encontré el problema. 

var landingUrl = $window.location.host + "/login";
$window.open(landingUrl, "_self");

La variable landingUrl se configuró en 'domain.com/login', que no funcionaría con $ window.location.href (que fue una de las cosas que probé). Sin embargo, después de cambiar el código a

var landingUrl = "http://" + $window.location.host + "/login";
$window.location.href = landingUrl;

ahora funciona.

javascript angularjs redirect angular-ui-router Thorbjørn Kappel Hansen
fuente
Probablemente debería agregar que también hay autenticación del lado del servidor en los datos, por lo que la anterior no es la única autenticación, es más una cuestión de conveniencia redirigir a la página de inicio de sesión, en lugar de mostrar una página en su mayoría vacía.
Thorbjørn Kappel Hansen
1
necesita el locationobjeto nativo usando$window.location=...
charlietfl
En su lugar, podría considerar convertirlo todo en AngularJS, incluida su autenticación; consulte esta publicación frederiknakstad.com/2013/01/21/…
Soren
El plan es incluir todo (incluido el inicio de sesión) dentro de la aplicación AngularJS eventualmente, pero como actualmente estamos haciendo la transición a AngularJS, la pantalla de registro / inicio de sesión parece ser la menos importante en esta etapa.
Thorbjørn Kappel Hansen

Respuestas:

82

Creo que la forma de hacer esto es $location.url('/RouteTo/Login');

Editar para mayor claridad

Digamos que mi ruta para mi vista de inicio de sesión era /Login, yo diría $location.url('/Login')que navegara a esa ruta.

Para ubicaciones fuera de la aplicación Angular (es decir, sin ruta definida), el JavaScript antiguo simple servirá:

window.location = "http://www.my-domain.com/login"
m.casey
fuente
Intenté eso. Desafortunadamente, eso redirige a www.domain.com/app/RouteTo/login en lugar de www.domain.com/login
Thorbjørn Kappel Hansen
Bien, eso no fue una intención literal. No sé qué ha definido como la ruta para su vista de inicio de sesión. Coloque cualquier ruta que pueda ser en el argumento del método $ location.url (). Edité la respuesta para mayor claridad.
m.casey
Ah bien. El problema aquí es que $ location.url todavía redirige a una ruta secundaria de la aplicación. Así, utilizando location.url $ ( '/ login') vuelve a dirigir a www.domain.com/app/login en lugar de www.domain.com/login
Thorbjørn Hansen Kappel
1
Bueno, como se indica en la pregunta, actualmente la página de inicio de sesión se encuentra fuera de la aplicación AngularJS. De ahí la necesidad de redirigir a www.domain.com/login en lugar de una ruta dentro de la aplicación.
Thorbjørn Kappel Hansen
5
También vale la pena mencionar que probablemente debería usar en $windowlugar de window(fuente: stackoverflow.com/questions/28906180/… )
Caleb Faruki
39

Parece que para la recarga de página completa $window.location.hrefes la forma preferida.

No provoca una recarga de página completa cuando se cambia la URL del navegador. Para volver a cargar la página después de cambiar la URL, use la API de nivel inferior, $ window.location.href.

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

Diego Ferri
fuente
19

¡Podría ayudarte! manifestación

Ejemplo de código AngularJs

var app = angular.module('urlApp', []);
app.controller('urlCtrl', function ($scope, $log, $window) {
    $scope.ClickMeToRedirect = function () {
        var url = "http://" + $window.location.host + "/Account/Login";
        $log.log(url);
        $window.location.href = url;
    };
});

Ejemplo de código HTML

<div ng-app="urlApp">
    <div ng-controller="urlCtrl">
        Redirect to <a href="#" ng-click="ClickMeToRedirect()">Click Me!</a>
    </div>
</div>
Anil Singh
fuente
3

No estoy seguro de qué versión, pero yo uso 1.3.14 y puedes usar:

window.location.href = '/employee/1';

No es necesario inyectar $locationni $windowen el controlador y no es necesario obtener la dirección de host actual.

CularBytes
fuente
-11

Tienes que poner:

< html ng-app = "urlApp" ng-controller = "urlCtrl">

De esta manera la función angular puede acceder al objeto "ventana"

Efraín Luna Villafuerte
fuente
¡No tengas miedo!
Mika