angulaire.js - [angular] Une fois le tableau effacé, la vue n'est pas mise à jour immédiatement

Question

J'ai récemment rencontré un problème lors de l'élaboration d'une liste de données :
La liste de données a une fonction de recherche Une fois saisie, les résultats de la recherche seront immédiatement demandés au serveur en fonction des mots-clés saisis. La vue restitue ensuite le résultat immédiatement. Le code spécifique est le suivant :

app.controller('ListViewController',function($scope){

    $scope.files=[];

    $scope.vm={
        key:''
    };

    $scope.query=function(){
        var param={
            nameFuzzy:$scope.vm.key
        }
        $http.post(url,param)
            .success(function(resp){
                angular.each(resp,function(item){
                    $scope.files.push(item);
                });
            });
    };

    $scope.$watch('vm.key',function(newVal,oldVal){
        if(newVal!==oldVal){
            //关键词发生变化时，清空列表
            $scope.files.length=0;
            //然后请求数据
            $scope.query();
        }
    });

    $scope.query();
});

Le problème actuel est le suivant : lorsque le tableau est effacé, la liste de la vue ne disparaît pas. Une fois les résultats de la recherche renvoyés et le rendu réussi, la liste précédente disparaît. les deux ensembles de données existeront-ils en même temps ? Il faut des centaines de millisecondes pour que l'ensemble de données précédent disparaisse. L'appel de $scope.$apply() ne sert à rien. Cela générera une erreur : degist en cours, indiquant. que la vue est déjà mise à jour, mais je ne sais pas pourquoi elle est si lente.
ps : Il existe d'autres listes de données, qui n'ont pas ce problème

Answer 1

Essayez d'appeler scope.$digest(); Est-ce que ça marche ?

Answer 2

app.controller('ListViewController',function($scope){

$scope.files=[];

$scope.vm={
    key:''
};

$scope.query=function(){
    var param={
        nameFuzzy:$scope.vm.key
    }

    $scope.files=[]; //增加

    $http.post(url,param)
        .success(function(resp){
            angular.each(resp,function(item){
                $scope.files.push(item);
            });
        });
};

});

Utilisez simplement ng-change="query()" dans la zone de saisie du mot clé du modèle. N'abusez pas de la montre à moins de savoir comment l'utiliser

Answer 3

用
`$timeout(function(){
$scope.files = [];
})`