Question

仅当我在输入中键入＆gt; 3个字符时，才使用AngularJS搜索大数据。

var app = angular.module('test_table', []);
app.controller('main_control',function($scope, $http){
    $scope.inputChange = function(){
        if($scope.search.length > 3){
            $http.get("http://localhost:7001/load").success(function(data){
                $scope.loaded=data; 
            });
        }
        if($scope.search.length < 4){
            $http.get("http://localhost:7001/load").success(function(data){
                $scope.loaded=""; 
            });
        }
    }       
});

HTML code：

<input type="search" class="inputsearchform" ng-model="search" ng-change="inputChange()"/>
...
<tr class="rowR" ng-repeat="data in loaded | filter:{song_name: search}">

我有问题。当我输入超过3个字符然后使用输入中的默认按钮删除所有内容时，整个数据将加载到页面，这会导致很大的延迟。怎么处理呢？

Answer 1

您可以添加以下内容：

if($scope.search.length == 0){
      $scope.loaded=""; 
}

或创建一个由删除按钮触发的功能：

$scope.delete = function(){ 
      $scope.loaded=""; 
}

PS ：如果您要分配一个空变量，则不应该调用服务：

        if($scope.search.length < 4){
            $http.get("http://localhost:7001/load").success(function(data){
                $scope.loaded=""; 
            });
        }

应该是：

        if($scope.search.length < 4){
                $scope.loaded=""; 
        }

PS 2 ：if($scope.search.length < 4)也没有意义，因为如果有3个字符 - 这个if语句将被满足，因为@ aw04

Answer 2

为了避免延迟，您必须限制要渲染的数据。为此，您可以使用角度过滤器limitTo。将limitTo设置为您要加载为默认值的任何值。

如何避免在Angular中搜索时加载整个数据

2 个答案: