Question

我有一些类别的URL参数像/：rootcategory /：sub /：sub这是动态的，对于我必须路由的产品，如/ product /：productname /：producturl .....它是使用ui-sref工作得很好但是当我点击URL并刷新它时，配置变得混乱，在两种URL情况下它都会将我发送到类别页面。

.state('category3',{
        url: '/:name1/:name2/:name3',
        templateUrl: 'template/product/productsgridpage.html',
        controller: 'categoryCtrl',
        parent: 'productpagelayout'
    })
.state('product', {
            url: '/product/:name1/:name2',
            templateUrl: 'template/product/detailpage.html',
            controller: 'productCtrl',
            parent: 'productpagelayout',
        })

Answer 1

更新答案：

问题是类别还验证了产品页面，类别状态（/:name1/:name2/:name3）的url参数将接受（/product/disc/test），因为name1没有任何特殊检查来限制关键字products从不经过。所以我建议使用正则表达式检查来限制关键字产品，这样就不会出现这个问题。

类别的正则表达式将类似于

url: '/{name1:\b(?!\bproduct\b)\w+\b}/:name2/:name3',

如果name1参数以product开头，则regex检查将失败并且不会输入类别状态，因此它将进入产品状态，这就是我们所需要的。

.state('category3',{
    url: '/{name1:\b(?!\bproduct\b)\w+\b}/:name2/:name3',
    templateUrl: 'template/product/productsgridpage.html',
    controller: 'categoryCtrl',
    parent: 'productpagelayout'
})
.state('product', {
        url: '/product/:name1/:name2',
        templateUrl: 'template/product/detailpage.html',
        controller: 'productCtrl',
        parent: 'productpagelayout',
})

上一个答案：

由于您传递“products / hplaptop5050 / hp-laptop”，它将产品参数作为一个类别本身，因此转到类别，您需要一个静态变量甚至一个唯一的输入变量，所以它不会混淆，我可以建议像“/ {categoryid：int} /：name1 /：name2 /：name3”或“/ 0 /：name1 /：name2 / ：name3“，以便我们与产品和类别页面有明显区别。

.state('category3',{
        url: '/{categoryid:int}/:name1/:name2/:name3',
        templateUrl: 'template/product/productsgridpage.html',
        controller: 'categoryCtrl',
        parent: 'productpagelayout'
    })
.state('product', {
            url: '/product/:name1/:name2',
            templateUrl: 'template/product/detailpage.html',
            controller: 'productCtrl',
            parent: 'productpagelayout',
        })

请阅读UI路由器文档中的状态声明页面部分，如果需要，您可以提供不同的approch。

参考：ui router state docs

我想动态地在ui路由器中应用参数

1 个答案: