AngularJS 与 UI 路由器、多个和嵌套视图有什么关系？

Question

我一直在阅读有关 nested views 和 multiple views 的信息，但我找不到同时使用两者的示例

在一个着陆页中，我有多个视图，一个接一个。一张图讲一千个字：

考虑：

• 每个部分/视图都有完整的窗口高度，所以在滚动时我想将位置更改为/view1、/view2、/view3 等。
• • 这应该与转到/view1/b 或/view3/b 并显示子视图（view1.b 或view3.b）兼容。
• • 滚动不应再次加载页面。

我成功地单独完成任务，但不是一起完成。

Answer 1

您可以将 $statePorivder 嵌套视图与

一起使用

       config(function ($stateProvider) {

            $stateProvider
              .state('main', {
                url: '/',
                views: {
                  '': {
                    templateUrl: 'app/main/layout.html',
                    controller: 'LayoutController'
                  },
                  'header@main': {
                    templateUrl: 'app/main/header/layout.html',
                    controller: require("./headerController.js")
                  },
                  'left@main': {
                    templateUrl: 'app/main/left/layout.html',
                    controller: require("./leftController.js")
                  },
                  'content@main': {
                    templateUrl: 'app/main/content/layout.html',
                    controller: require("./conentController.js")
                  },
                  'right@main': {
                    templateUrl: 'app/main/right/layout.html',
                    controller: require("./rightController.js")
                  }
                }
              });
          };