Angularjs - 使用数据库中的新数据重新加载范围

我正在使用Angularjs构建搜索页面。一切正常，但我担心的是，如果用户在搜索页面已经加载后向数据库添加新条目会怎么样？新条目不会显示在过滤器上。如何实现这一目标？以下是我的代码。任何帮助表示赞赏。Angularjs - 使用数据库中的新数据重新加载范围

var app = angular.module('searchApp', ['ui.bootstrap']); 

app.filter('startFrom', function() { 
    return function(input, start) { 
     if(input) { 
      start = +start; //parse to int 
      return input.slice(start); 
     } 
     return []; 
    } 
}); 
app.controller('searchCrtl', function ($scope, $http, $timeout) { 
    $scope.showLoader = true; 
    $http.get('PostsController.do?cmd=postDetails').success(function(data){ 
     $scope.showLoader = false; 

     $scope.list = data; 
     $scope.currentPage = 1; //current page 
     $scope.entryLimit = 10000; //max no of items to display in a page 
     $scope.filteredItems = $scope.list.length; //Initially for no filter 
     $scope.totalItems = $scope.list.length; 
    }); 
    $scope.setPage = function(pageNo) { 
     $scope.currentPage = pageNo; 
    }; 
    $scope.filter = function() { 
     $timeout(function() { 
      console.log($scope.list); 
      $scope.filteredItems = $scope.filtered.length; 
     }, 10); 
    }; 
    $scope.sort_by = function(predicate) { 
     $scope.predicate = predicate; 
     $scope.reverse = !$scope.reverse; 
    }; 
});

有没有办法使范围加载数据库中的新数据过滤项目？

来源

2016-12-02 Keerthi

从数据库中提取新数据？数据库更新时可能需要websocket才能得到通知 – Zen

如何使用它？你给我一些链接/ – Keerthi

与Http不同，Websocket使后端服务器和客户端浏览器能够在不创建新连接的前提下进行通信。 [MDN]（https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API）具有最好的文档。你可能不需要它，因为它消耗了很多资源，除非你需要它是实时的 – Zen

tmp解决方法是每10秒查询一次服务器。您仍然需要了解websocket是什么，它用于什么以及如何在后端和前端使用它。

app.controller('searchCrtl', function ($scope, $http, $timeout) { 
    $scope.showLoader = true; 

    // <-- 
    $scope.currentPage = 1; 
    $scope.entryLimit = 10000; 
    setInterval(function() { 
     $http.get('PostsController.do?cmd=postDetails').success(function(data){ 
      $scope.showLoader = false; 
      $scope.list = data; 
      $scope.filteredItems = $scope.list.length; //Initially for no filter 
      $scope.totalItems = $scope.list.length; 
     }); 
    }, 10000); // update data every 10 sec 
    // --> 


    $scope.setPage = function(pageNo) { 
     $scope.currentPage = pageNo; 
    }; 
    $scope.filter = function() { 
     $timeout(function() { 
      console.log($scope.list); 
      $scope.filteredItems = $scope.filtered.length; 
     }, 10); 
    }; 
    $scope.sort_by = function(predicate) { 
     $scope.predicate = predicate; 
     $scope.reverse = !$scope.reverse; 
    }; 
});

来源

2016-12-02 17:24:10 Zen

Angularjs - 使用数据库中的新数据重新加载范围

回答

相关问题