Question

我有一个大型的AngularJS应用程序，它被分成不同的功能模块。它目前捆绑在单个JavaScript文件中，因此所有模块都在初始页面加载时加载。我希望按功能区域拆分捆绑包，并在用户到达某些特定点（视图）时按需加载应用程序的各个部分。

我在RequireJS和ocLazyLoad的帮助下整理了捆绑和延迟加载。尽管有最后的事情需要解决。每个模块定义自己的路由，因此如果我不在初始加载时加载它，它的路由将是未定义的，直到用户到达触发模块加载的点。

问题是只需粘贴其URL即可直接到达丢失的路由，在这种情况下，AngularUI路由器将发出$ stateNotFound事件。我有一个处理程序，它将检查请求的URL并加载适当的模块（以及缺少的路由）。最后一个缺失的部分是，在加载模块和路由后，重试路由。有谁知道如何实现这一目标？ AngularUI路由器常见问题解答中有一节旨在解释这一点，但它没有填写。

Answer 1

你应该使用＆＃34;当＆＃34; $ urlRouterProvider的函数，而不是捕获$ stateNotFound事件：

$urlRouterProvider.when('/myUrl', ['$match', '$state', function($match, $state) {
    // do something, check for module loaded for example
    // ... and then transitionTo
    $state.transitionTo(state, $match);
}]);

延迟$ state.transitionTo直到你想要（例如在预加载模块之后）。

但是如果你真的想使用$ stateNotFound，你可以这样做：

$rootScope.$on('$stateNotFound', function(event, unfoundState, fromState, fromParams){ 
    event.preventDefault()
    // do your module load
    // ... and then transitionTo
    $state.transitionTo(unfoundState.to, unfoundState.toParams, unfoundState.options);
})

如何在Angular UI路由器中的$ statusNotFound事件上重试路由请求

1 个答案: