如何从Angular.js中的不同视图中搜索项目

Question

在我家：

.state('home',{
        url: '',
        views: {
           '': {
            templateUrl: 'views/main.html',
            controller:'MainCtrl'
           }
    ...

我浏览了一些书，并有一个简单的搜索字段来过滤项目：

<input type="text" ng-model="search">
<article class="items" ng-repeat="book in allBooks  | filter: search" >

这可行，但是我想将输入的文件添加到侧边栏中，并将该侧边放在单独的视图中-这样我就不必在每个视图中都重复它。 所以在我的index.html我有以下代码

 <div ng-include ng-controller="MainCtrl" src="'views/sidebar.html'" class="sidebar"></div>
 <div class="container" ui-view></div>

假设这是一个好习惯，有没有办法在侧边栏内添加搜索输入字段，并且仍然在原始状态下影响循环？

谢谢

Answer 1

您可以将主状态设为边栏的嵌套视图。 然后，在侧边栏视图中绑定到过滤器的ng-model将可用于原始状态。 当主状态在自己的范围内找不到搜索属性时，其主状态将委派给上述侧边栏范围。

这是我快速又肮脏的示例： http : //plnkr.co/gmUaDLSfJxOL42EPZ9ak