angulaire.js - [angular] Une fois le tableau effacé, la vue n'est pas mise à jour immédiatement
PHP中文网
PHP中文网 2017-05-15 16:52:44
0
3
685

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

PHP中文网
PHP中文网

认证高级PHP讲师

répondre à tous(3)
滿天的星座

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

Peter_Zhu

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

洪涛


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

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal