如何捕获无效的URL？

Question

我正在使用Angular JS ui-router构建一个简单的HTML站点.

我已经构建了一个自定义404页面('www.mysite /#/ error/404'),如果用户键入了像'www.mysite /#/ invalidUrl'这样的URL,用户将被重定向到该页面.此功能通过以下代码段实现:

$urlRouterProvider
            .when('', '/')
            .when('/home', '/')
            .otherwise('/error/404');

以下状态片段:

$stateProvider.state('404', {
            parent: 'app',
            url: '^/error/404',
            views: {
                'errorContent@main': {
                    controller: 'error404Controller',
                    templateUrl: 'js/general/templates/error404.html'
                }
            }
        });

我正在尝试捕获用户请求的无效URL,以便向用户显示,如下所示.

无法找到您请求的网址
请求:www.mysite.com/#/invalidUrl

我试过听'$ stateNotFound'事件,这似乎只是在请求特定的无效状态时触发.我也试图听'$ stateChangeStart','$ locationChangeStart'和'$ locationChangeSuccess'事件,但找不到实现此功能的方法.

这可能吗？请分享您的想法 - 谢谢

Answer 1

真棒!谢谢RadimKöhler.我不知道当我搜索时我是如何登陆该线程的,但这有助于我得到答案.

我改变了该线程中的答案以适合我的情况,我将在下面留下以供任何其他用户参考.

$stateProvider.state('404', {
            parent: 'app',
            url: '^/error/404',
            views: {
                'errorContent@main': {
                    controller: 'error404Controller',
                    templateUrl: 'js/general/templates/error404.html'
                }
            }
        });

        $urlRouterProvider
            .when('', '/')
            .when('/home', '/')
            .otherwise(function ($injector, $location) {
                var state = $injector.get('$state');
                state.go('404', { url: $location.path() }, { location: true });
        });

所以神奇的变化是为'其他'选项定义的功能.我没有更改"错误"状态的URL.相反,我使用'state.go'激活状态'404'并将位置路径作为状态参数传递.

设置location=true将带您进入州的URL,但location=false不会.无论您喜欢哪种方式,都可以轻松访问无效的URL.