Angularjs polling to create realtime feed
I am new to angularjs and want to create a page which is nearly realtime.
I would like to poll a php file which queries a database and returns the latest results as json to to added to the feed.
I have created a controller for the page and made it update every 5 seconds.
I have managed to get it on the view
I just need some guidance on the best way to get the data via php.
I would like to poll a php file which queries a database and returns the latest results as json to to added to the feed.
I have created a controller for the page and made it update every 5 seconds.
discussionApp.controller('ViewCtrl', function($scope, $interval /* , $location, $http */) {
console.log("View Controller");
$scope.pageClass = 'page-view';
$scope.data = "";
$interval(function() {
//update $scope.dataevery 5000ms
$scope.data = new Date();
}, 5000);
});I have managed to get it on the view
{{data | date : 'medium'}}I just need some guidance on the best way to get the data via php.
Radek Baranowski
It's just a little bit off topic, but you can consider using thing like firebase to work as a database for your AngularJS app. It gives you live bi-directional coupling between your page and data model, without worrying about php. (https://www.firebase.com/docs/web/libraries/angular/quickstart.html)
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks Alex,
Ive got it sort of working
How would I go about appending each loop to the last??
Ive got it sort of working
discussionApp.controller('ViewCtrl', function($scope, $interval, $http /* , $location, */) {
console.log("View Controller");
$scope.pageClass = 'page-view';
$interval(function() {
console.log("polling");
$http.get('getData.php')
.success(function(data) {
$scope.contents = data;
});
}, 5000);
});How would I go about appending each loop to the last??
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
So the last thing Im not sure how to do is remember the last ID added and pass it as a parameter to my PHP script so I don't get the same row twice.
Should I get it from the table row ID?? or remember it in a global variable??
Should I get it from the table row ID?? or remember it in a global variable??
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
How do I do this??
ASKER
Think I got there:
discussionApp.controller('ViewCtrl', function($scope, $interval, $http /* , $location, */) {
console.log("View Controller");
$scope.pageClass = 'page-view';
$scope.contents = [];
lastID = "0";
$interval(function() {
$http.post('getData.php?id='+lastID)
.success(function(data, status) {
//$scope.contents = data;
if (data != undefined) {
Array.prototype.push.apply($scope.contents, data);
lastID = $scope.contents[$scope.contents.length - 1].discussionID;
console.log("LAST ID: "+lastID);
}
})
.error(function (data, status) {
console.log("ERROR: "+status)
$scope.status = status;
});
}, 5000);
});
Just a couple of remarks:
1. lastID variable is declared on top without the var keyword.
This makes it a global variable. To avoid at any cost! :)
If for instance, in another piece of code you also declare a variable with the same name, in the same way (without the var), they will both be pointers to the same variable and override themselves. This is a nightmare to debug.
So, replace line 6 with:
2. Probably is just for test, but don't leave console.log calls in the code.
the console object is a global object, and the way javascript works, it has to go up through the whole scope tree until it actually finds it attached to the window object.
This is another thing to avoid. Depending where it is, it can actually affect the performance in a significant way.
Apart from that, looks good :)
1. lastID variable is declared on top without the var keyword.
This makes it a global variable. To avoid at any cost! :)
If for instance, in another piece of code you also declare a variable with the same name, in the same way (without the var), they will both be pointers to the same variable and override themselves. This is a nightmare to debug.
So, replace line 6 with:
var lastID = "0";2. Probably is just for test, but don't leave console.log calls in the code.
the console object is a global object, and the way javascript works, it has to go up through the whole scope tree until it actually finds it attached to the window object.
This is another thing to avoid. Depending where it is, it can actually affect the performance in a significant way.
Apart from that, looks good :)