Использование $ routeProvider для перенаправления на маршруты за пределами Angular

Question

Я написал часть веб-приложения в Angular. Чтобы гарантировать, что все маршруты охвачены, я хотел добавить свойство redirectTo в $routeProvider, так что неверные маршруты возвращаются в корень веб-приложения, которое не использует Angular.

Я пробовал:

$routeProvider.otherwise({ 
    redirectTo: '/' 
}); 

, но, очевидно, это только маршруты в угловом контролируемой части URL, так что пользователи будут перенаправляться на URL-адрес, как http://app.com/angular-part-of-web-app# вместо http://app.com, где я хотел их идти.

Я работал вокруг этого, имея пустой частичный, чтобы действовать как «404» страницы, а затем контроллер, который использует только $window объект для перенаправления на нужную страницу:

routes.js

// Redirect to site list. 
$routeProvider.when('/404', { 
    templateUrl: '/partials/404.html', 
    controller: 'RedirectCtrl' 
}); 

// Redirect to the 404 page. 
$routeProvider.otherwise({ 
    redirectTo: '/404' 
}); 

controllers.js

// Controller to redirect users to root page of site. 
.controller('RedirectCtrl', ['$scope', '$window', function ($scope, $window) { 

    $window.location.href = '/'; 
}]); 

Тем не менее, это означает, что «слишком хакерские, должно быть лучше» сигнальные колокола. Есть ли лучший способ сделать это в Angular?

EDIT: Angular routes - redirecting to an external site? не дал ответа на тот же вопрос. Я собираюсь оставить свой вопрос открытым, вместо того, чтобы пометить его как дубликат (пока), так как с тем, чтобы Угловой мир двигался так быстро, предыдущий ответ больше не может быть так.

Answer 1

Вышеуказанное решение с/404 не работает для меня. Это, однако, кажется, работает

.otherwise({ 
    controller : function(){ 
     window.location.replace('/'); 
    }, 
    template : "<div></div>" 
}); 

PS. Я использую Angular 1.2.10

Answer 2

Вы могли бы сделать что-то вроде этого:

$routeProvider.when('/404', { 
    controller: ['$location', function($location){ 
     $location.replace('/'); 
    }] 
}).otherwise({ 
    redirectTo: '/404' 
}); 

Это, по существу, то же самое, только она использует меньше кода.

Answer 3

Не уверен, какая версия Angular JS была принята, но свойство redirectTo принимает функцию. Итак, почему бы не сделать что-то простое, как это:

$routeProvider.otherwise({ 
    redirectTo: function() { 
     window.location = "/404.html"; 
    } 
}); 

Очевидно, что вы должны создать свой собственный 404.html. Или где бы ни находилась ваша страница 404.

Answer 4

Ни один из ответов, включая отмеченный ответ, не работал для меня. Я считаю, что мое решение также решает вашу проблему, и я бы поделился своим прецедентом, а также ссылкой для будущих читателей.

Проблема с использованием метода контроллера маршрута: Когда контроллер загружается маршрутизации уже доступны состояния API История для меня (я использую режим HTML5, не уверен, влияет ли этот режим не-HTML5).

В результате, хотя я могу перенаправить людей на правильную страницу, используя window.location.замените ('/'); , если пользователь затем нажмет на Назад в своем браузере, он переходит в недействительное состояние.

Сценарий: Мы реализуем многостраничную модель, и у меня есть модуль моей админ-страницы отдельно от модулей моей домашней страницы (не-администратора). У меня есть $ location.path ('/') где-то в одном из моего контроллера администратора, но поскольку домашняя страница не упакована в модуль страницы администратора, я хочу принудительно перезагрузить всю страницу, когда обнаруживаю маршрут '/'.

Решение: Мы должны перехватить на $ routeChangeStart перед тем ngRoute доступ к любой государственной информации. Таким образом, мы можем даже указать внешний HREF пропускания URL к RedirectTo парам в $ маршруте

angular.module('app',['ngRoute']) 
.config(['$routeProvider', function($routeProvider) { 
    $routeProvider 
    .when('/admin/default', {template: somePageTemplate}) 
    /* 
    * More admin-related routes here... 
    */ 
    .when('/',{redirectTo:'/homepage'}) // <-- We want to intercept this 
    .otherwise({redirectTo: '/admin/default'}); 
}]) 
.controller('MainCtrl',[ // <- Use this controller outside of the ng-view! 
    '$rootScope','$window', 
    function($rootScope,$window){ 
    $rootScope.$on("$routeChangeStart", function (event, next, current) { 
     // next <- might not be set when first load 
     // next.$$route <- might not be set when routed through 'otherwise' 
     // You can use regex to match if you have more complexed path... 
     if (next && next.$$route && next.$$route.originalPath === '/') { 
     // Stops the ngRoute to proceed 
     event.preventDefault(); 
     // We have to do it async so that the route callback 
     // can be cleanly completed first, so $timeout works too 
     $rootScope.$evalAsync(function() { 
      // next.$$route.redirectTo would equal be '/homepage' 
      $window.location.href = next.$$route.redirectTo; 
     }); 
     } 
    }); 
    } 
]); 

Просьба представить любую обратную связь, как я буду использовать этот код сам. Приветствия

Ссылка: https://github.com/angular/angular.js/issues/9607

Answer 5

Привет, хотя это было два года, только для некоторых, кто искать этот ответ, просто используйте window.location.assign («/ Войти»). Это работа для меня.