Angularjs-分离全局搜索和页面内容

到目前为止，我的简单angular应用程序有三个页面；每个页面都有自己的控制器，用于处理与用户和后端系统的各种交互。我想添加一个div标题，其中包含一个搜索栏，很像您在StackOverflow！上每个页面顶部看到的那个！。

问题在于在搜索栏和页面内容之间分离控制器逻辑。我觉得它们应该放在单独的控制器中，这样代码就可以模块化了。搜索控制器将处理所有页面上与搜索栏的交互以及显示搜索结果页面，而页面内容控制器将处理其特定页面内容的逻辑。

我目前的设置是（片段）：

app.js

function appRouteConfig($stateProvider, $urlRouteProvider) {
    $stateProvider
    .state("landingpage", {
        url: '/',
        controller: "LandingPageCtrl",
        templateUrl: "views/html/landing.html"
    })
    .state("discussion", {
        url: '/discussion',
        controller: "DiscussionCtrl",
        templateUrl: "views/html/discussion.html"
    })
    .state("search_content", {
        url: "/search_results",
        controller: "SearchCtrl",
        templateUrl: "views/html/searchpage.html"
    })
}

controller.js

controllers.controller("SearchCtrl", ["$scope", "$location", 
    function($scope, $location) {
       $scope.search = function(query) {
           // Query backend server and redirect to /search_results with response.
       }
    }
]);

讨论.html

<div data-ng-include=" 'views/html/searchNav.html ' "></div>
<div class="discussion">
    <!-- Discussion html -->
</div>

但这里的问题是，我已经在app.js中为每条路由声明了一个控制器。因此，当我访问/discussion时，将加载的控制器将是DiscussionCtrl，并且不会加载搜索控制器，因此搜索无法工作。

我可以删除路线中指定的所有控制器，并手动设置它们，大致如下：

<div ng-controller="SearchCtrl">
    ....
</div>
<div ng-controller="DiscussionCtrl">
    ....
</div>

这样，我的两个控制器都会被加载，但在我的所有页面上手动指定它似乎很痛苦。如果我在未来添加20多个新页面（不按比例扩展），这似乎不会很好地扩展，如果多个不同的路由使用同一个控制器，这会很烦人。

另一种解决方案可能是，我在每个控制器中都有一个doSearchSubmit()，但由于搜索代码是相同的（只是查询后端服务器并重定向到搜索结果页面），因此在所有控制器中都是重复的代码，这是不好的。

我应该如何在Angular中正确集成搜索导航栏？