0
我正在尝试使用动态文本查询过滤ng-repeat
结果。它部分工作,但我试图让它过滤不同的<div>
元素的结果 - 它不起作用。 下面是HTML片段,它的工作原理:AngularJS查询过滤器不工作
<form class="form-inline">
<input style="width:100%" ng-model="query" type="text" placeholder="Search Through {{clients.length}} Clients" autofocus>
</form>
<div class="container1">
<div style="max-width:100%; border-width: medium; border-style: solid; border-color: gray" class="datagrid">
<table>
<thead>
<tr>
<th> ID </th>
<th> Name </th>
</tr>
</thead>
<tbody>
<tr ng-repeat="client in clients | filter: query | orderBy :'id' track by $index"">
<td>
{{client.id}}
</td>
<td>
<a ng-href = "client/{{client.id}}"><span style="color:#0000FF"> {{client.name}}</span></a> | <a ng-href = "docgen/{{client.id}}">Letters</a> | <a ng-href = "callog/{{client.id}}">{{client.lastcall}}</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
我试图用相同的搜索查询,以影响本节:
<tabset id="center" align="center">
<tab>
<tab-heading style="text-align:left">
<span ng-click="showme=0" style="text-align:left">Personal
</span>
</tab-heading>
<div ng-show="showme=='0'" id="center" >
<div class="container" id="wrapper">
<div ng-controller="ClientCtrl">
<form ng-submit="updateClient(updateform)" role="form" ng-init="updateform = {}">
<div id="center" class="datagrid">
<table>
<thead>
<tr>
<th> ID </th>
<th> Phone </th>
<th> Address </th>
<th> Zip </th>
</tr>
</thead>
<tbody>
<tr ng-repeat="client in clients | orderBy:'id' | filter: query | limitTo: 1 track by $index">
<td>
{{client.id}}
</td>
<td>
<div class="form-group">
<input class="form-control" ng-model="updateform.phone" name="phone" ng-init="updateform.phone=client.phone" type="text "/>
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" ng-model="updateform.address" name="address" ng-init="updateform.address = client.address" type="text "/>
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" ng-model="updateform.zip" name="zip" ng-init="updateform.zip = client.zip" type="text "/>
</div>
</td>
</tr>
</tbody>
<thead>
<tr>
<th> SSN </th>
<th> Age </th>
<th> DOB </th>
<th> DLN </th>
</tr>
</thead>
<tbody>
<tr ng-repeat="client in clients | orderBy: 'id' | filter: query | limitTo: 1 track by $index "">
<td>
<div class="form-group">
<input class="form-control" ng-model="updateform.ssn" name="ssn" ng-init="updateform.ssn = client.ssn" type="text" />
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" ng-model="updateform.age" name="age" ng-init="updateform.age = client.age" type="text"/>
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" ng-model="updateform.birthday" name="birthday" ng-init="updateform.birthday=client.birthday" type="text"/>
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" ng-model="updateform.dln" name="dln" ng-init="updateform.dln = client.dln" type="text" />
</div>
</td>
</tr>
</tbody>
</table>
<button type="submit" ng-click="updateClient()"><strong>Update</strong></button>
</div>
</div>
</div>
</form>
</div>
</tab>
我也有这个在我的角度控制器:
$scope.query = "";
你可能有更好的运气制作成服务这一点,而不是一个控制器。请记住,控制器不应该提供代码功能,它应该。这是服务/工厂的责任。尽可能减少你的控制器。 –