dynamic – 如何延迟Angular.js中的路由定义?

前端之家收集整理的这篇文章主要介绍了dynamic – 如何延迟Angular.js中的路由定义?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我已经配置了一些基本路由,在所有用户登录之前可用:
App.config(function ($routeProvider) {
    $routeProvider.
        when('/login',{ templateUrl: 'views/login.html',controller: PageStartCtrl.Controller }).
        otherwise({ redirectTo: '/login' });
});

所以用户可以做的唯一的事情就是登录。在用户登录后,我想注册额外的路由,如:

$http
  .post('api/Users/Login',{   User: userName,Password: userPassword })
  .success(function (response : any) {
    App.config(function ($routeProvider) {
      $routeProvider
        .when('/dashboard',{ templateUrl: 'part/dashboard.html',controller: DashboardCtrl.Controller });
  });

但是,我想我应该调用.config方法只有一次,因为$ routeProvider是一个全新的实例,不知道/ login路由。进一步的调试显示,$ resourceProvider的第一个实例在解析视图更改时使用。

问:以后有什么办法如何注册路由?

解决方案从Add routes and templates dynamically to $routeProvider可能工作,但是是相当丑陋(涉及全局变量nastyGlobalReferenceToRouteProvider)。

由于路由是在提供者级别上定义的,通常只能在配置块中定义新路由。麻烦的是,在配置块中所有的重要服务仍然未定义(最值得注意的是$ http)。所以,表面上看起来像w不能动态定义路由。

现在,事实证明,在实践中,很容易在应用程序生命周期的任何时候添加/删除路由!看看$ route source code我们可以看到所有的路由定义简单地保存在$ route.routes哈希,可以在任何时间点修改像这样(简化示例):

myApp.controller('MyCtrl',function($scope,$route) {    
    $scope.defineRoute = function() {
        $route.routes['/dynamic'] = {templateUrl: 'dynamic.tpl.html'};
    };
});

这里是jsFiddle演示这在行动:http://jsfiddle.net/4zwdf/6/

在现实中,如果我们想接近AngularJS正在做的事情,路由定义逻辑应该有点复杂,因为AngularJS也定义了一个重定向路由以正确处理路由/结束(使其有效可选)。

所以,虽然上述技术将工作,我们需要注意以下几点:

>这种技术取决于内部实现,如果AngularJS团队决定更改路由定义/匹配的方式,可能会中断。>也可以使用$ route.routes定义其他路由,因为默认路由存储在空密钥下的同一个散列中

原文链接:/angularjs/145821.html

猜你在找的Angularjs相关文章