Currently utilizing angular.js for my project.
I am implementing long polling with a server and would like to dynamically update an element in the view, specifically one with a class of 'updated', whenever the value of build_tag
is incremented.
I am facing difficulties trying to figure out a graceful solution to add the updated class when there is a change in catalog.products[??].build_tag
.
<div ng-controller="MyAwesomeController as env">
<div class="product-wrapper" ng-class="{'error': product.error, 'updated': HELP!! }" ng-repeat="product in env.catalog">
<!-- displaying content in creative and engaging ways -->
EnvironmentController:
app.controller('EnvironmentController', ['$http', '$interval', function($http, $interval) {
var vm = this;
var pollingInterval = 5000;
vm.catalog = {
// Displaying only 2 products here for brevity's sake. Usually, I have numerous products.
products: [{
name: 'widget1',
error: false,
build_tag: 7
}, {
name: 'widget2',
error: false,
build_tag: 5
}]
};
function fetchData() {
$http.get('/builds.json').then(function (resolved) {
if (resolved.status === 200) {
vm.catalog = angular.merge(vm.catalog, resolved.data);
}
}, function (rejected) {
... handle errors appropriately
});
}
$interval(fetchData, pollingInterval);
... more controller-related tasks
Does this explanation make sense? With each poll to the server, I update vm.config
. Each product-wrapper should monitor its build_tag
, and I want to apply an updated
class to the relevant element in the view if the build_tag
has changed.