将AngularJS 1.2.x路由附加到不同/命名视图

Question

我正在使用AngularJS重写Web应用程序前端。我还是新手，特别是版本1.2.x.

我有一个带有静态左侧导航的应用程序，在链接点击时，会打开第二个带有各种结果的侧边栏（来自api / json响应）。例如，假设单击“类别”链接，然后打开一个新的侧边栏，其中包含分类链接列表。

辅助侧边栏可能有多种视图，因此转到#/categories或#/tags会根据需要在其中显示不同的内容。

我正在尝试设计如何处理第二个侧边栏内链接的路由，以便它不会覆盖视图。

例如：

#/categories会打开侧边栏，其中包含指向#/categories/:cat

的链接

点击#/categories/:cat需要有一个路由/控制器，以便我可以运行一些逻辑，但不应该擦除#/categories

所显示的模板

我找不到很多关于如何使用Angular 1.2 +

的文档

.config(['$routeProvider',
    function($routeProvider) {
        $routeProvider
          .when('/categories/:cat', {
            template : '',
            controller  : 'CategoryController',
            view: 'thisDoesntWork'
          })
    }]
)

Answer 1

目前没有一种优雅的内置方式来实现您想要做的事情，因为目前ngRoute仅支持html中的单个ngView元素。你有一些选择：

1. 使用ui-router代替ngRoute。 ui-router支持并行和嵌套视图。
2. 将ngRoute与ngInclude结合使用。在您的情况下，您的主html页面将包含第一个静态侧边栏。第二个侧边栏将加载到ngInclude内，因此只要您点击导航元素，第一个侧边栏就会为ngInclude设置一个新模板。然后使用ngView根据您在第二个侧边栏中选择的操作显示主要内容。因此，只有第二个侧边栏内的导航项才会改变浏览器位置，即角度路径。