[英]Angular routes - redirecting to an external site?
In an AngularJS routes file there is the option for an otherwise
route, replacing a 404: 在AngularJS路由文件中,可以选择otherwise
路由,替换404:
$routeProvider
.when(...)
.otherwise({
redirectTo: 'my/path'
});
Is there a way to do this such that the otherwise redirects to a page that is not in the app? 有没有办法做到这一点,否则重定向到不在应用程序中的页面? I tried 我试过了
$routeProvider
.when(...)
.otherwise({
redirectTo: 'http://example.com'
});
but this jsut tried to redirect to that path in my app, which doesn't exist. 但是这个jsut尝试重定向到我的应用程序中的那条路径,这条路径不存在。 The solution I know of is to do manual redirection in a $scope.$on('$routeChangeStart')
in a top-level controller, but this is a lot of code duplication (and it's ugly). 我所知道的解决方案是在顶级控制器中的$scope.$on('$routeChangeStart')
中进行手动重定向,但这是很多代码重复(而且很难看)。 Is there a better way? 有没有更好的办法?
To my knowledge , this is not possible, as the routeProvider
handles internal routes only. 据我所知 ,这是不可能的,因为routeProvider
只处理内部路由。
What you can do though is 你可以做的是
$routeProvider
.when(...)
.otherwise({
controller: "404Controller",
template: "<div></div>"
});
and then just use window.location.href = 'http://yourExternalSite.com/404.html'
in the controller. 然后在控制器中使用window.location.href = 'http://yourExternalSite.com/404.html'
。
In my case, this worked for me: 就我而言,这对我有用:
$routeProvider
.when('/my-path', {
...typical settings...
}).
.otherwise({
redirectTo: function(obj, requestedPath) {
window.location.href = appConfig.url404;
}
});
Just take a look at angular.js link behaviour - disable deep linking for specific URLs 只需看看angular.js链接行为 - 禁用特定URL的深层链接
and use this 并使用这个
target="_self" TARGET = “_自我”
<a href="link" target="_self" >link</a>
I won't recommend just using window.location.href in new controller as pointed in other answer because the ngRoute would have set the history to be pointing at the non-existent page (so when user clicks back it will keep redirecting to the 404 page). 我不建议在新控制器中使用window.location.href,如其他答案中所指出的那样,因为ngRoute会将历史记录设置为指向不存在的页面(因此当用户点击它时,它将继续重定向到404页)。 I tried and it failed. 我试过但失败了。
I would like to point you to my related solution to another SO question here: https://stackoverflow.com/a/27938693/1863794 我想在此向您指出另一个SO问题的相关解决方案: https : //stackoverflow.com/a/27938693/1863794
I adopted that and applied to your scenario. 我采用了它并应用于您的场景。 I don't think it's that bad of an idea to use MainCtrl
outside of the ng-view since it'll be only declared once unless you have nested layers of ng-view... I don't see any code duplication either, you can place MainCtrl in a separate module if it bothers you so much: 我不认为在ng-view之外使用MainCtrl
是个坏主意,因为它只会被声明一次,除非你有嵌套的ng-view层...我也没有看到任何代码重复,你可以把MainCtrl放在一个单独的模块中,如果它困扰你那么多:
.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when(..)
.otherwise({redirectTo: 'http://yourExternalSite.com/404.html'});
}])
.controller('MainCtrl',[ // <- Use this controller outside of the ng-view!
'$rootScope','$window',
function($rootScope,$window){
$rootScope.$on("$routeChangeStart", function (event, next, current) {
// next.$$route <-not set when routed through 'otherwise' since none $route were matched
if (next && !next.$$route) {
event.preventDefault(); // Stops the ngRoute to proceed with all the history state logic
// We have to do it async so that the route callback
// can be cleanly completed first, so $timeout works too
$rootScope.$evalAsync(function() {
// next.redirectTo would equal be 'http://yourExternalSite.com/404.html'
$window.location.href = next.redirectTo;
});
}
});
}
]);
Cheers 干杯
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.