Angularjs 如何使用嵌套状态&；视图是否正确？_Angularjs_Angular Ui Router

Angularjs 如何使用嵌套状态&；视图是否正确？

angularjs

Angularjs 如何使用嵌套状态&；视图是否正确？,angularjs,angular-ui-router,Angularjs,Angular Ui Router,这是我的页面结构： root URL '/home' -> toolbar -> tool1 -> tool2 -> menuLeft -> menuRight -> content of home 如何编写主页状态？如果工具栏、菜单左键和菜单右键在页面上相同，则应在主HTML模板中定义它们，它们中的每一个都可以有自己的控制器，因

这是我的页面结构：

        root URL '/home'
        -> toolbar
            -> tool1
            -> tool2
        -> menuLeft
        -> menuRight
        -> content of home

如何编写

主页

状态？

如果工具栏、菜单左键和菜单右键在页面上相同，则应在主HTML模板中定义它们，它们中的每一个都可以有自己的控制器，因此它们可以独立于

ui路由器中定义的应用程序状态来管理自己的状态：
<body>
    <div id="toolbar" ng-controller="ToolbarCtrl"> ... </div>
    <div id="left" ng-controller="LeftMenuCtrl"> ... </div>

    <div id="content" ui-view>
        <!-- content here depends on what you configure in ui-router -->
        <!-- home.html for 'home' state, and 'about.html' for 'about' state -->
    </div>

    <div id="right" ng-controller="RightMenuCtrl"> ... </div>
</body>

请注意，如果您在每个状态（即“HomeCtrl”、“AboutCtrl”）中定义控制器，则当您导航到该状态时，它将自动应用于整个页面——您不需要使用ng controller

function($routeProvider) {
    $routeProvider.
      when('/toolbar/:toolNumber', { // here toolnumber is a optional parameter
        templateUrl: 'partials/toolbar.html',
        controller: 'toolbarCtrl'
      }).
      when('/menuLeft', {
        templateUrl: 'partials/menuLeft.html',
        controller: 'menuLeftCtrl'
      }).
      when('/menuRight', {
        templateUrl: 'partials/menuRight.html',
        controller: 'menuRightCtrl'
      }).
      otherwise({
        redirectTo: '/home'
      });
  }]);

function($routeProvider) {
    $routeProvider.
      when('/toolbar/:toolNumber', { // here toolnumber is a optional parameter
        templateUrl: 'partials/toolbar.html',
        controller: 'toolbarCtrl'
      }).
      when('/menuLeft', {
        templateUrl: 'partials/menuLeft.html',
        controller: 'menuLeftCtrl'
      }).
      when('/menuRight', {
        templateUrl: 'partials/menuRight.html',
        controller: 'menuRightCtrl'
      }).
      otherwise({
        redirectTo: '/home'
      });
  }]);