Использование $ window или $ location для перенаправления в AngularJS

90

Приложение, над которым я работаю, содержит различные состояния (с использованием ui-router), где некоторые состояния требуют, чтобы вы вошли в систему, другие общедоступны.

Я создал метод, который корректно проверяет, вошел ли пользователь в систему, и в настоящее время у меня возникают проблемы с перенаправлением на нашу страницу входа в систему, когда это необходимо. Следует отметить, что страница входа в настоящее время не находится в приложении 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 правильно отображается предполагаемый URL. В следующей строке я пробовал практически все, от $ window.open до window.location.href, и что бы я ни пробовал, перенаправление не происходит.

РЕДАКТИРОВАТЬ (РАЗРЕШЕНО):

Нашел проблему. 

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

Для переменной landingUrl было задано значение «domain.com/login», что не работало с $ window.location.href (что было одной из вещей, которые я пробовал). Однако после изменения кода на

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

теперь это работает.

javascript angularjs redirect angular-ui-router Турбьёрн Каппель Хансен
источник
Вероятно, следует добавить, что для данных также существует аутентификация на стороне сервера, поэтому приведенная выше аутентификация не является единственной, это скорее вопрос удобства для перенаправления на страницу входа в систему, а не для отображения в основном пустой страницы.
Thorbjørn Kappel Hansen
1
вам нужен собственный locationобъект, используя$window.location=...
charlietfl
Вместо этого вы могли бы подумать о том, чтобы сделать все это AngularJS, включая вашу аутентификацию - см. Этот пост frederiknakstad.com/2013/01/21/…
Soren
План состоит в том, чтобы в конечном итоге включить все (включая логин) в приложение AngularJS, но поскольку в настоящее время мы осуществляем переход на AngularJS, экран регистрации / входа кажется наименее важным на данном этапе.
Thorbjørn Kappel Hansen

Ответы:

82

Я считаю, что способ сделать это $location.url('/RouteTo/Login');

Редактировать для ясности

Скажем, мой маршрут для моего представления входа был /Login, я бы сказал, $location.url('/Login')перейти к этому маршруту.

Для местоположений за пределами приложения Angular (т. Е. Без определения маршрута) будет использоваться простой старый JavaScript:

window.location = "http://www.my-domain.com/login"
м.Кейси
источник
Просто попробовал. К сожалению, это перенаправляет на www.domain.com/app/RouteTo/login, а не на www.domain.com/login
Thorbjørn Kappel Hansen
Да, это не значит быть буквальным. Я не знаю, что вы определили как маршрут для представления входа в систему. Поместите все, что могло бы быть на этом маршруте, в аргумент для метода $ location.url (). Я отредактировал ответ для ясности.
m.casey
Ах да. Проблема здесь в том, что $ location.url по-прежнему перенаправляет на подпуть приложения. Таким образом, использование $ location.url ('/ login') перенаправляет на www.domain.com/app/login, а не на www.domain.com/login
Торбьёрн Каппель Хансен
1
Что ж, как указано в вопросе, в настоящее время страница входа находится за пределами приложения AngularJS. Следовательно, необходимо перенаправить на www.domain.com/login, а не на путь в приложении.
Thorbjørn Kappel Hansen
5
Также стоит упомянуть, что вам, вероятно, следует использовать $windowвместо window(источник: stackoverflow.com/questions/28906180/… )
Калеб Фаруки
39

Кажется, что для полной перезагрузки страницы $window.location.hrefпредпочтительнее.

Это не вызывает полной перезагрузки страницы при изменении URL-адреса браузера. Чтобы перезагрузить страницу после изменения URL-адреса, используйте API нижнего уровня $ window.location.href.

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

Диего Ферри
источник
19

Это может вам помочь! демо

Образец кода 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;
    };
});

HTML-код-образец

<div ng-app="urlApp">
    <div ng-controller="urlCtrl">
        Redirect to <a href="#" ng-click="ClickMeToRedirect()">Click Me!</a>
    </div>
</div>
Анил Сингх
источник
4

Не уверен, с какой версии, но я использую 1.3.14, и вы можете просто использовать:

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

Нет необходимости вводить $locationили $windowв контроллер, и нет необходимости получать текущий адрес хоста.

CularBytes
источник
-11

Вы должны поставить:

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

Таким образом, угловая функция может получить доступ к объекту "окно"

Эфраин Луна Виллафуэрте
источник
Не бойся!
Мика