Question

我有3个按钮组，刷新按钮和表格。所有|多佛|奥兰多

在页面加载时，通过调用api将所有数据显示在表中。

使用angularjs过滤器我已根据城市过滤数据，即Dover或Orlando。

当前情况：当用户在Dover上并单击刷新按钮时，所有数据都会再次加载，即ALL和Refresh具有相同的api调用。

所需方案：当用户在Dover上并单击刷新按钮时，Dover数据应该刷新。

代码：

            <div class="myrow">
                <div class="col-md-6 col-sm-6">
                    <label for="documentStatus">Queues: </label>                      
                    <div class="btn-group" role="group" aria-label="...">
                        <button type="button" class="btn btn-primary active" ng-click="updateData(); myFilter = null">ALL</button>
                        <button type="button" class="btn btn-primary" ng-click="myFilter = {city : 'Dover'}">Dover</button>
                        <button type="button" class="btn btn-primary" ng-click="myFilter = {city : 'Orlando'}">Orlando</button>
                    </div>
                </div>
            </div>

            <div class="container" ng-init="updateData()">
                <div class="pull-right">
                    <button type="button" class="btn btn-primary btn-md" value="Refresh" ng-click="myFilter = null; updateData()">
                        <span class="glyphicon glyphicon-refresh"></span> Refresh
                    </button>
                </div>
                <table class="table table-bordered">
                    <thead>
                        <tr>
                            <th></th>
                            <th>Queue</th>
                            <th>No of Documents</th>
                            <th>Oldest document Datetime</th>
                            <th>Allocated Users</th>
                        </tr>
                    </thead>
                    <tbody ng-repeat="queue in Queues | filter: myFilter">
                        <tr>
                            <td>
                                <label class="checkbox-table">
                                    <input type="checkbox" name="checkbox" ng-model="queue.isChecked" id="check-box-{{$index}}">
                                </label>
                            </td>
                            <td class="col-md-3">{{ queue.queue }}</td>
                            <td class="col-md-2">{{ queue.noOfDocuments }}</td>
                            <td class="col-md-2">{{ queue.oldestDoc}}</td>
                            <td class="col-md-5">{{ queue.allocatedUsers}}</td>
                        </tr>
                    </tbody>
                </table>
            </div>

Answer 1

您可以尝试使用angular.copy（arr）：

 var data = {
         original: myOriginalData,
         filteredData: angular.copy(myOriginalData) //this is unbind link on the arrayy
    };

仅在过滤条件下刷新数据

1 个答案: