Realizo una consulta a un archivo .json y con la respuesta hago una tabla pero debido a que el archivo .json se actualiza constantemente, necesito estar observando si ese archivo ha cambiado para mostrarlo en tiempo real en la aplicacion, y he intentado pero no consigo el two way data binding.
app.js
(function(){
var myapp = angular.module("appMonitor",[]);
myapp.factory('myService', function($http,$timeout) {
var promise;
var myService = {
get: function() {
if ( !promise ) {
// $http returns a promise, which has a then function, which also returns a promise
promise = $http.get('./json/verifyEmpty.json').then(function (response) {
// The then function here is an opportunity to modify the response
console.log(response.data);
// The return value gets picked up by the then in the controller.
return response.data;
});
}
// Return the promise to the controller
return promise;
}
};
return myService;
});
myapp.controller('monitorCtrl', function(myService,$scope) {
// Call the async method and then do stuff with what is returned inside our own then function
myService.get().then(function(d) {
$scope.response = d;
});
});
})();
verifyEmpty.json
[
{
"name":"luis",
"lastname":"perez",
"age":27,
"gender":"m",
"haircolor":"yellow",
"eyecolor":"brown",
"student":false
},
{
"name":"monse",
"lastname":"chuang",
"age":28,
"gender":"f",
"haircolor":"black",
"eyecolor":"black",
"student":true
},
{
"name":"sarah",
"lastname":"lee",
"age":29,
"gender":"f",
"haircolor":"yellow",
"eyecolor":"green",
"student":true
},
{
"name":"luisa",
"lastname":"ortega",
"age":28,
"gender":"f",
"haircolor":"black",
"eyecolor":"blue",
"student":false
},
{
"name":"diana",
"lastname":"garcia",
"age":27,
"gender":"f",
"haircolor":"brown",
"eyecolor":"brown",
"student":true
}
]
monitor.php
<body ng-app="appMonitor">
<div class="" ng-controller="monitorCtrl">
<table>
<tr>
<th><strong>name</strong></th>
<th><strong>lastname</strong></th>
<th><strong>age</strong></th>
<th><strong>gender</strong></th>
<th><strong>haircolor</strong></th>
<th><strong>eyecolor</strong></th>
<th><strong>student?</strong></th>
</tr>
<tr ng-repeat="r in response" ng-cloak>
<td>{{r.name}}</td>
<td>{{r.lastname}}</td>
<td>{{r.age}}</td>
<td>{{r.gender}}</td>
<td>{{r.haircolor}}</td>
<td>{{r.eyecolor}}</td>
<td ng-show="r.student">Yes</td>
</tr>
</table>
<!-- {{response}} -->
</div>
<script type="text/javascript" src="./js/148libraries/angular.min.js"></script>
<script type="text/javascript" src="./js/app.js"></script>
</body>