0

我的 AngularJS 控制器正在调用 API 来获取成员列表。可以使用多个过滤器查询 API，例如年龄范围、姓名搜索、邮政编码等。

我想要完成的是让用户感觉搜索真的很快。因此，当用户进行过滤时，我正在关注过滤器的更改。当过滤器更改时，我会立即执行新的搜索 API 调用，而不是等待用户单击“搜索”。

其思路是，当用户完成过滤并点击“搜索”时，系统应该已经完成​​搜索，可以输出搜索结果。

问题：当用户单击“搜索”并publish()调用该函数时，我必须确保当前没有 API 搜索正在进行，如果有，请等待它完成。然后我将搜索结果从隐藏发布memberslist.temp到可见memberslist.members。

// Current code works, except the publish function. See the TODO:

app.controller('SearchCtrl', ['$scope', 'Restangular', '$timeout', function($scope, Restangular, $timeout) {

    // Pushes prefetched search results over to the visible search results
    // TODO: Check if search is ongoing...
    $scope.publish = function() {
        $scope.memberslist.members = $scope.memberslist.temp;
    };

    // Watch filters for changes
    var searchTimer    = false;
    var previousSearch = [$scope.name, $scope.minAge, $scope.maxAge];

    $scope.$watch('[name, minAge, maxAge]', function(newVal, oldVal, scope){
        if (searchTimer) {
            $timeout.cancel(searchTimer);
        }  

        // Do search only after the user has stopped typing for 400 ms
        searchTimer = $timeout(function(){
            if (!_.isEqual(newVal, previousSearch)) {
                previousSearch = newVal;
                scope.search();
            }
        }, 400);
    }, true);

    $scope.search = function() {
        var query_params = {
            name:        $scope.name, 
            price_min:   $scope.minAge,
            price_max:   $scope.maxAge
        };

        Restangular.all('members').getList(query_params)
            .then(function(members){
                $scope.memberslist.temp = members;
            });
    };
}]);

我的第一个想法是设置一个像 isSearching = true 这样的变量，然后在搜索调用返回结果后将其设置回 false。似乎无法让它工作。

4

1 回答 1

1

也许是这样的：

$scope.$watch('!is_searching && publishing', function(newVal){
  if (newVal) {
    $scope.memberslist.members = $scope.memberslist.temp;
    $scope.publishing = false;
  }
})

搜索开始时在范围上将“is_searching”设置为 true，并在搜索完成时将其设置为 false。单击搜索按钮时，在范围上设置“发布”。

那应该给你想要的行为。如果没有搜索正在运行，则立即发布，否则等待搜索完成。

于 2013-08-30T09:02:03.890 回答