Mettre à jour la table angularjs bootstrap avec des données en temps réel en utilisant ng-repeat

J'utilise la table bootstrap avec ng-repeat pour remplir la table. Le problème est que je ne peux pas mettre le tableau à jour et afficher les données.

J'ai écrit un élément de glisser-déposer dans mes angularjs. Une fois que je glisse et dépose un fichier sur celui-ci, je récupère ces informations dans mon contrôleur.

Ce glisser-déposer est une directive personnalisée.

Le problème est que je reçois le détail du fichier dans mon contrôleur

$scope.getFiles = function(res) { $scope.fileList = res; console.log(res); }

En HTML

 <file-drop fetch-files="getFiles"></file-drop>

Où getFiles est la fonction appelée dans le contrôleur et returing la valeur. Pendant que je fais console.log et dragand drop, je peux voir Object dans la console.

Mais lorsque je cite ceci

 $scope.fileList = res;

En HTML

 <table class="table table-condensed" > <thead> <tr> <th>Name</th> <th>Type</th> <th>Size</th> <th>Last Modified</th> </tr> </thead> <tbody> <tr ng-repeat="file in fileList"> <td>{{file.name}}</td> <td>{{file.type}}</td> <td>{{file.size}}</td> <td>{{file.lastModified}}</td> </tr> </tbody> </table>

Et appelez ceci en html en utilisant ng-repeat, je ne vois rien. Dans la directive, les valeurs sont [poussées dans un tableau et les informations de dépôt précédentes sont stockées sauf si le navigateur est actualisé.

Comment puis-je mettre à jour la table en temps réel. Ma structure d'objet est comme ci-dessous

 [{name: "Topic_modelling.xlsx", type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", size: 39274, lastModified: Mon Aug 03 2015 13:40:53 GMT+0530 (IST)}]

Cela se produit parce que vous remplacez l'objet entier.

Angular regarde le précédent, que vous avez dépassé par

$scope.fileList = res;

Le plus simple consiste à utiliser la syntaxe "controller as" des contrôleurs afin que votre objet soit pris en tant que propriété dans le modèle.

https://docs.angularjs.org/api/ng/directive/ngController

Votre contrôleur deviendrait donc

 ... this.getFiles = function(res) { this.fileList = res; console.log(res); }

Et le modèle

 <div ng-controller="NameOfController as fileCtrl" ... <tr ng-repeat="file in fileCtrl.fileList">

Après cette propriété de surveillance angulaire de l'objet fileCtrl et non la valeur primitive