如何在不创建新范围的情况下将一个部分包含到另一个中？

Question

我有这条路线。

// index.html
<div ng-controller="mainCtrl">
    <a href='#/one'>One</a>
    <a href='#/two'>Two</a>
</div>​​​​​​​​​
<div ng-view></div>

这就是我将部分加载到我的ng-view。

// app.js
​var App = angular.module('app', []);​​​​​​​
App.config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/one', {template: 'partials/one.html', controller: App.oneCtrl});
    $routeProvider.when('/two', {template: 'partials/two.html', controller: App.twoCtrl});
  }]);

当我单击链接时，它会在ng-view中向我显示适当的标记。但是，当我尝试将using
包含partials/two.html在内时，它会正确显示它，但是会创建一个不同的范围，因此我无法与其进行交互。partials/one.html``ng- include

// partials/two.html - markup
<div ng-controller="twoCtrl">I'm a heading of Two</div>

// partials/one.html - markup
<div ng-controller="oneCtrl">I'm a heading of One</div>
<div ng-include src="'partials/two.html'"></div>

我该如何解决这个问题？还是有其他方法可以达到相同的结果？

Answer 1

您实际上可以在不使用共享服务的情况下执行此操作。$ scope。$ emit（…）可以将事件调度到$
rootScope，后者可以侦听事件并重新广播到子作用域。

演示：http：//jsfiddle.net/VxafF/

参考： http :
//www.youtube.com/watch?v=1OALSkJGsRw
（请参阅第一个评论）