Question

在 ngRoute 中，您可以执行以下操作：

changeNotificationListReadStatus()

如何使用ui-router实现相同的目的？

Answer 1

如果您实际上只有两种状态，则可以执行以下操作：

$stateProvider.state({
    name: 'cardboardDepartments',
    url: '/root/cardboards/departments',
    template: 'my template'
})

$stateProvider.state({
    name: 'supplierCardboardDepartments',
    url: '/suppliers/{supplierId}/cardboards/departments',
    template: 'my template'
})

假设UiRouter> 1.0.0，使用父属性（而不是parent.child名称约定），并使用components，则稍微充实一些示例。您可以使用$stateProvider来注册路线：

$stateProvider.state({
    name: 'root',
    url: '/root',
    component: 'rootComponent'
})

$stateProvider.state({
    name: 'cardboards',
    parent: 'root',
    url: '/cardboards',
    component: 'cardboardsComponent'
})

$stateProvider.state({
    name: 'cardboardsDepartments',
    parent: 'cardboards',
    url: '/departments',
    component: 'cardboardsDepartmentsComponent'
})

$stateProvider.state({
    name: 'suppliers',
    url: '/suppliers',
    component: 'suppliersComponent'
})

$stateProvider.state({
    name: 'supplier',
    parent: 'suppliers',
    url: '/:supplierId',
    component: 'supplierComponent'
})

$stateProvider.state({
    name: 'supplierCardboards',
    parent: 'supplier',
    url: '/cardboards',
    component: 'cardboardsComponent'
})

$stateProvider.state({
    name: 'supplierCardboardsDepartments',
    parent: 'supplierCardboards',
    url: '/departments',
    component: 'cardboardsDepartmentsComponent'
})

如果您确实具有如上所述的嵌套结构，并且希望维护父子关系，但是嵌套多个ui视图则没有意义，您应该查看named views。

如果您正在使用控制器和模板，则只需将这些状态定义上的component属性替换为：

controller: 'cardboardsController',
template: 'your template'

您可以查看UiRouter的教程here。 guide也是很好的资源。

AngularJS ui-router如何为同一状态做多个URL变体-何时ngRoute

1 个答案: