将当前搜索结果添加为表格的新行

Question

我有一个搜索文本框，它将从数据库中搜索客户记录。客户记录有“姓名”、“年龄”、“地址”和更多字段。我正在使用 single 客户名称进行搜索，并在表格中显示该客户详细信息。

第一次搜索后，如果我搜索其他客户名称，则当前客户详细信息将替换该表中的先前搜索结果。

我想在同一个表中显示所有搜索结果（即以前的、当前的）。

我正在使用 angularjs。这是我的搜索角度控制器代码

$scope.search = function () {
    var price = '{custName: "' + $scope.Prefix + '" }';
    var post = $http({
        method: "POST",
        url: "/api/Price/GetDetails",
        dataType: 'json',
        data: price,
        headers: { "Content-Type": "application/json" }
    });
    post.success(function (data, status) {
        $scope.Customers = data;
        $scope.IsVisible = true;
    });
    post.error(function (data, status) {
        $window.alert(data.Message);
    });
};

html代码

<div class="controls">
                                    <input type="text" ng-model="Prefix" placeholder="Search Material..." class="form-control" /><br />
                                    <button type="button" class="btn btn-outline-dark" ng-click="search()">Search</button>
                                </div>

表格 html 代码

<tbody ng-repeat="m in Customers">
                                                    <tr>
                                                        <td align="center">
                                                            <a class="btn btn-default"><em class="fa fa-pencil"></em></a>
                                                            <a class="btn btn-danger"><em class="fa fa-trash"></em></a>
                                                        </td>
                                                        <td class="hidden-xs">1</td>
                                                        <td>{{m.PM}}</td>
                                                        <td>{{m.Description}}</td>
                                                        <td>{{m.Hier}}</td>

如何显示该表中的所有搜索结果

Answer 1

您必须将结果存储在变量中并不断将新结果附加到该变量中。为此，我们可以使用 Javascript 的 concat() 函数。

var dataAll = [];
$scope.search = function () {
    var price = '{custName: "' + $scope.Prefix + '" }';
    var post = $http({
        method: "POST",
        url: "/api/Price/GetDetails",
        dataType: 'json',
        data: price,
        headers: { "Content-Type": "application/json" }
    });
    post.success(function (data, status) {
        dataAll = dataAll.concat(data);
        $scope.Customers = dataAll;
        $scope.IsVisible = true;
    });
    post.error(function (data, status) {
        $window.alert(data.Message);
    });
};

那么您还需要一个清除按钮来将 dataAll 重置为 []。