Question

我正在尝试动态地将模板包含到我的index.html中。 index.html的一般结构是：

<body>

  <header ng-controller="Main">
    <section>
      <!-- global stuff -->
    </section>
    <section ng-include="moduleName + '/views/menubar.html'">
      <!-- module-based stuff -->
    </section>
  </header>

  <div id="view" ng-view></div>

</body>

示例网址

example.com/<app_name>/index.html#/<module_name>[/method_name]

当路线发生变化时，我无法弄清楚如何更新$scope.moduleName。我的麻烦是双重的：

标题的控制器是 Main ，而不是与视图关联的控制器，所以我不能？从视图的控制器更新$scope.moduleName（因为 Main ，视图的控制器是兄弟姐妹）。
在 Main 中，我尝试设置$scope.$on('$routeChangeSuccess',…)，但显然是it is not notified of route changes。

我已经考虑在监听器上设置一个$ rootScope。$（如SO#15355346中所述），用于路由更改并向孩子们广播，然后他们发回备份路由，然后广播回来所以它可用于 Main 。但这似乎令人发指。

我真的更喜欢将标题保留在ng-view之外。

编辑我注意到$route.current.scope有一个名为module_name的对象（可能是因为与路径的module_name关联的控制器名称相同）。我想知道我是否能以某种方式使用该对象的名称......

Answer 1

如果没有完整的图片，很难说你的代码有什么问题。你展示的东西对我来说很好。

请参阅我创建的this plunk以显示执行此操作的功能。请注意，您还可以使用自定义属性扩展路径对象，例如moduleName：

    $routeProvider.when('/page1', {
        template: 'one',
        controller: 'one',
        moduleName: 'firstModule'
    });

AngularJS根据路由动态设置ngInclude的参数

1 个答案: