导航栏中的AngularJS搜索框在视图中加载表

嗨，我有一个需要筛选的数据表。我需要能够使用导航栏搜索框过滤数据，导航栏搜索框位于显示表格数据的视图之外。我真的不知道该怎么做。我的导航栏中有此代码这是搜索框的位置：

<div class="form-group">
                <input type="search" class="form-control" placeholder="Search" id="searchText" name="searchText" ng-model="query">
            </div>
            <div class="form-group">                    
                <!--<a class="btn default-btn lookupbtn" ng-href="#/lookup">Lookup</a>-->
                <button class="btn default-btn lookupbtn">Lookup</button>

查找

我的表数据当前如下所示：

<div>
<div>Lookup Results</div>
<!--<div><input type="text" id="searchText" name="searchText" ng-model="query" /></div>-->
<table ng-if="query">
    <thead>
        <tr>
            <td>Acc. ID</td>
            <td>Acc. Name</td>
            <td>Acc Address</td>
            <td>City</td>
            <td>Zip</td>
            <td>Phone</td>
            <td>Parent Name</td>
            <td>Account Type</td>
            <td>Account Status</td>
            <td>Credit Term</td>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="result in vm.results | filter:query ">
            <td>{{ result.accountId }}</td>
            <td>{{ result.accountName }}</td>
            <td>{{ result.address }}</td>
            <td>{{ result.city }}</td>
            <td>{{ result.state }}</td>
            <td>{{ reuslt.zip }}</td>
            <td>{{ result.phone }}</td>
            <td>{{ result.parentName }}</td>
            <td>{{ result.accountType }}</td>
            <td>{{ result.accountStatus }}</td>
            <td>{{ result.accountStatus }}</td>
            <td>{{ result.creditTerm }}</td>
        </tr>
    </tbody>
</table>

查找结果
附件ID
附件名称
行政协调会地址
城市
拉链
电话
父名称
帐户类型
帐户状态
信用期限
{{result.accountId}
{{result.accountName}
{{result.address}
{{result.city}
{{result.state}
{{reuslt.zip}
{{result.phone}
{{result.parentName}
{{result.accountType}
{{result.accountStatus}
{{result.accountStatus}
{{result.creditTerm}

如何使导航栏搜索框与视图中的表一起工作？如果需要任何其他信息，请告诉我。

---

如果需要plnkr，请告诉我，我会制作一个。

实现这一点的简单方法是使用

$rootScope

。当您将

query

变量添加到$rootScope而不是本地$scope时，它在应用程序中的任何位置都可用，包括您的视图

---

另一种选择是为特定目的使用服务。该服务将是一个存储

query

值并允许您在需要时设置/获取它的单例。这比使用

$rootScope

更复杂，尽管通常认为这是一种更好的做法。您是否尝试过在按钮中添加

ng单击

，然后在控制器中添加函数以返回结果？所以像

ng click=fnSearch（）

？@ewahner我不知道如何编写我需要的自定义筛选器。你能给我看一个代码示例，或者给我指一个示例吗？我是Angular的新手。如果你能用你当前的代码创建一个Plunkr，我可以修复它，那里有一个Plunkr给你。搜索时需要单击的按钮是查找按钮。我也是Plnkr的新手。所以，如果你需要更多的代码，请告诉我。你的代码已经在工作了。我不确定你的Plunkr中有什么需要修复。不起作用的是导航栏中的查找按钮。我需要用户能够在navbar页面的输入中输入搜索项，然后将其显示在lookup.html页面的表格中。