2013-10-24 98 views
4

因此,我在我的awesome angularjs-powered单页面应用程序中使用了功能齐全的静态路由器,现在我可以完成使某些路由动态化的任务。AngularJS - 使用UI-Router的动态路由

说直到现在我有以下参数路径:

  • ^/user/:userName
  • ^/product/:productName
  • ^/category/:categoryName

现在,他们都需要在路径^/:slug回应,这将使调用一些后端API来获取与该slug对应的资源类型并最终转发请求t到具体的controller及其具体的resolve,templateUrl,abstractdata

有什么想法?


编辑:我想相同的功能将有可能路线镜子(又名透明转发),其中内部另一条路线比所要求的被触发,即使路线的变化是不公开可见。但我仍然不知道这是否有可能在角度或UI路由器...)

回答

3

我想通了。它不漂亮,但它很好用。

除了重命名上面^/:username(别名“个人资料”),^/:productName(别名“产品”)和^/:categoryName(别名“类”)我现有的路线,我创建了一个新的通用路由/:slug其控制器ResolverController。后者必须在$stateProvider中首先声明。

ResolverController是以下功能:

function ($state, $stateParams, resource) { 
    switch (resource) { 
    case 'user': 
    $state.go('profile', {'username': $stateParams.slug}); 
    break; 
    case 'product': 
    $state.go('products', {'productName': $stateParams.slug}); 
    break; 
    case 'category': 
    $state.go('category', {'categoryName': $stateParams.slug}); 
    break; 
    default: 
    // 404 
    break; 
    } 
} 

你可能不知道关于第三个参数resource。它由这个状态的决定返回并且保存关于所请求的段落的资源类型的信息。