Javascript 有没有一种更干净的方法可以将角度ui嵌套路由与ui路由器一起使用？

我正在研究Angular，并且已经发现了它的一些很好的用途。我使用Angular UI路由器为客户机构建了自定义导航。这很简单，但我想知道是否有一种“更干净”的简化方法来做到这一点

以下是我目前使用的代码：

angular.module('website', ['ui.state']).     
config(function($stateProvider, $routeProvider){
$stateProvider
    .state('index', {
        url: "", // root route
        views: {
            "viewA": {
                templateUrl: "partials/home.html"
            },

        }
    })
    .state('route1', {
        url: "/route1",
        views: {
            "viewA": {
                templateUrl: "partials/sticks.html"
            },
        }
    })
    .state('route2', {
        url: "/route2",
        views: {
            "viewA": {
                templateUrl: "partials/apparel.html"
            },

        }
    })
    .state('route3', {
        url: "/route3",
        views: {
            "viewA": {
                templateUrl: "partials/bauer.html"
            },

        }
    })
     .state('route4', {
        url: "/route4",
        views: {
            "viewA": {
                templateUrl: "partials/bauer-vapor.html"
            },

        }
    })
})

这仅适用于嵌套导航上的一个级别。如果我在每个级别都有几个链接或项目，那么这将是一段冗长、杂乱的代码。有没有一种更简洁、更简单的方法来编写代码，这样我就不会有一个超长的列表，列出所有的页面以及它们要去哪里

---

我同意这样做，我只是认为必须有更好、更干净的方法来做到这一点。

命名视图是可选的，特别是如果您只有一个视图，我建议您使用未命名视图。您可能应该深入了解UI路由器wiki和指南。此外，项目主自述文件刚刚更新。它现在显示了嵌套状态的快速启动示例，这实际上是一个更常用的功能。在大多数情况下，确实不需要多个命名视图

基本上，您将把每个州的声明缩短为：

.state（'route3'{ url:“/route3” templateUrl:“partials/bauer.html”

---

})

通过使用数组来定义传递给.state（）调用的所有值，它可能会稍微压缩，然后您可以使用数组上的循环来进行.state调用，这将在某种程度上缩短时间（取决于列表的实际长度），但我想您仍然需要维护一个相当混乱的数组，所以这可能更好。我认为另一种选择是只定义主列表，然后在顶层视图中定义该视图的每个子级导航元素？只是随便说说而已。