Javascript AngularJS智能表在显示所有行时过滤带有空格的特殊字符

我正在运行一些表，这些表在控制器/服务设置中使用了代码的pipe/ajax部分

我遇到的一个问题是，当值中有特殊字符且带有空格时，无法对其进行过滤。例如，如果lastname为“lastname firstname”，则无法过滤数据，但可以过滤名称“lastname”，并且可以很好地执行“lastname firstname”

$scope.itemsByPage = -1;

我可以得到一些帮助来弄清楚为什么这可能无法正确过滤吗

谢谢大家!

编辑：我注意到我忘了添加过滤器

app.filter('propsFilter', function() {
  return function(items, props) {
    var out = [];

    if (angular.isArray(items)) {
      var keys = Object.keys(props);

      items.forEach(function(item) {
        var itemMatches = false;

        for (var i = 0; i < keys.length; i++) {
          var prop = keys[i];
          var text = props[prop].toLowerCase();
          if (item[prop].toString().toLowerCase().indexOf(text) !== -1) {
            itemMatches = true;
            break;
          }
        }

        if (itemMatches) {
          out.push(item);
        }
      });
    } else {
      // Let the output be the input untouched
      out = items;
    }

    return out;
  };
});

app.controller('mainCtrl', ['$scope', '$window', 'Resource', function($scope, $window, service) {

    var ctrl = this;

    this.displayed = [];

    $scope.itemsByPage = $window.datatableperPage;

    this.callServer = function callServer(tableState) {

        ctrl.isLoading = true;

        var pagination = tableState.pagination;

        var start = pagination.start || 0;
        var number = pagination.number || 10;

        service.getPage(start, number, tableState).then(function(result) {
            ctrl.displayed = result.data;
            tableState.pagination.numberOfPages = result.numberOfPages; //set the number of pages so the pagination can update
            ctrl.isLoading = false;
        });
    };

}]);
app.factory('Resource', ['$q', '$filter', '$window', '$http', '$timeout', function($q, $filter, $window, $http, $timeout) {

    var nameData = [];

    $http.get($window.datatableSource).success(function(response) {
        nameData = response;
    });

    function getPage(start, number, params) {

        var deferred = $q.defer();

        var filtered = params.search.predicateObject ? $filter('filter')(nameData, params.search.predicateObject) : nameData;

        if (params.sort.predicate) {
            filtered = $filter('orderBy')(filtered, params.sort.predicate, params.sort.reverse);
        }

        var result = filtered.slice(start, start + number);

        $timeout(function() {
            //note, the server passes the information about the data set size
            deferred.resolve({
                data: result,
                numberOfPages: Math.ceil(filtered.length / number),
            });
        }, $window.datatableTimeout);

        return deferred.promise;
    }

    return {
        getPage: getPage
    };


}]);

在切片处的初始成对字符之后，过滤结果似乎消失了

result = filtered.slice(start, start + number); 

在本例中，我在名称的开头添加了“Clinical-”一词，当您开始键入“Clinical”一词时，它无法搜索该词，但其他词可以正常工作

$scope.itemsByPage = -1;

---

好的，我已经跟踪了所有函数，问题就在这一行。尝试将该值更改为任何正整数，您将看到您的应用程序工作正常

$scope.itemsByPage = -1;

在某些情况下，之所以会得到奇怪的过滤结果，是因为该值在后面的示例中用作

number

var result = filtered.slice(start, start + number);

因此翻译成

var result = filtered.slice(0, -1);

.slice（0，-1）

返回

过滤后的

数组的浅层副本，不包括最后一项。当您只有一个过滤结果时，您将收到一个空数组

瞧

---

更新 事实证明，使用

$scope.itemsByPage=-1

的全部原因都是对库在这种情况下的行为的错觉。
所需的行为是“始终返回所有行”，通过使用

这样我们就可以

var result = filtered.slice(0, Infinity);

---

这样就可以在输出中得到初始过滤数组。

可以在小提琴上模拟吗？我更新了这个问题，因为我忘了添加过滤代码。出于某种原因，我似乎无法让JSFIDLE显示列表if名称，但我开始了。这是你实际使用的过滤器吗？我试着在您的JSFIDLE中使用它（刚刚更改了JSFIDLE配置），它成功了。也许你是从外部获取数据的？如果是这样，您能提供您发送的http请求和接收的数据吗？由于CORS策略，它不会从外部服务加载。我已经将它重写为plnk，因为它的功能更强大，因此看起来它可以加载数据并进行良好排序。你能检查一下你的加载器是否也这样做吗？除非在结果数组中使用外部组件的过滤器，否则它似乎与外部组件无关。您收到的真实数据的来源是什么？它是类似于示例中的JSON还是其他东西？尝试为您修改plnkr，这一个通过双重承诺加载（来自http请求和搜索参数）。与组件库中的示例不同，它避免了不必要的数据生成并显示项目。如果这一个也不起作用，请复制开发人员控制台输出中的所有内容（如果有）。请复制服务器响应的标题。感谢您的解释。我知道是这样的，但我想知道你是否可以提供一个例子来避免“浅拷贝”，它排除了列表中的最后一个变量。嗯？如果您将

itemsByPage

设置为正常值，如25，您将得到

result=filtered.slice（0,25）

，它将按照您的预期工作。我不明白你需要什么样的例子。因为这有助于我得到答案，所以我会继续做下去并做标记。谢谢重点是在使用itemsByPage=-1时提供一个解决方案，但由于您的解释让我得到了我的答案，我将更新您的答案，因为一些积分到期。我很好奇，为什么您需要使用

-1

？这是完全错误的，如果你试图实现某个目标，你应该重新思考你的方法。我刚才在回答中向你解释说，它永远不会显示所有行，因为它总是会删除最后一项。如果您确实需要显示所有行，只需设置

$scope.itemsByPage=Infinity就可以了