Bonjour,

Voila je rencontre un petit problème avec mon code.

Ce que je fais

j'ai une application faite avec cakephp et angularjs. mon soucis est que lorsque j'actualise la page, avant l'affichage des données je vois tout le script de mes calculs de la vue s'affiché encore ce qui n'est pas beau a voir mais après chargement tout est ok je n'ai pas d'érreur. mon problème est de savoir comment ne plus affiché mes script lors du chargement de la page et ne l'affiché une fois les données tout transmises

voici un exemple de code de ma vue

<div class="col-sm-3 col-md-2">
                        <div class="panel panel-tile text-center">
                            <div class="panel-heading hidden">
                                <span class="panel-title"><i class="fa fa-times-circle"></i> Title</span>
                            </div>
                            <div class="panel-body bg-danger light">

                                <?= $this->Html->link("<i class='fa fa-times-circle text-muted fs45 br64 bg-danger p15 ph20 mt10'></i>",['plugin'=>'Administration','controller'=>'Geolocalisations','action'=>'SupportsInvalide'],['escape'=>false,'title'=>'Plus de détails']); ?>

                                <h1 class="fs35 mbn">{{totalgeolocaliser - (totalsupportvalide + totalItems) }}</h1>
                                <h6 class="text-white">SUPPORTS REJETES</h6>
                            </div>
                        </div>
                    </div>

code de mon controlleur

$scope.loadgeolocalisation = function(){

              $http.post($link7).success(function(data){
                 $scope.list = data.localisation;
                 $scope.totalgeolocaliser = data.totauxall;
                 $scope.totalsupportvalide = data.totauxval;

                $scope.filteredItems = $scope.list.length;
                $scope.totalItems = $scope.list.length;

                });
                $scope.setPage = function(pageNo) {
                        $scope.currentPage = pageNo;
                    };
                    $scope.filter = function() {
                        $timeout(function() { 
                            $scope.filteredItems = $scope.filtered.length;
                        }, 10);
                    };
                    $scope.sort_by = function(predicate) {
                        $scope.predicate = predicate;
                        $scope.reverse = !$scope.reverse;
                    };

        };

Ce que je veux

lorsque ma parge est en chargement, je ne veux plus voir les binding de ma vue ou opération s'affichés avant de disparaitre

Ce que j'obtiens

Quelqu'un à une ideé?

5 réponses


bon deja pour commencer, il n´y a aucun respect des best practice angular. un controlleur passe par un service pour utilisrr $http, pas directement dans le controlleur.

pour repondre a ton probleme, il suffit de gerer ton operation dans ton controlleur, et d´utiliser la directive ng-bind pour binder ton scope dans le html pour eviter d´avoir les {{}} qui aparaissent

romses
Auteur

Merci Defy mais tous ces actions se trouvent bien dans un controlleur sinon je n'aurai pas ces résultats.
Pour le ng-bind soit plus précis car jene vois pas comment faire
Merci SVP

justement, l'utilisation de $http doit se faire via un service que l'on injecte dans le controlleur. c'est les principe de base dans angularjs, si tu veut savoir comment faire, regarde la formation angularjs de grafikart.

ben simplement comme ceci:

//controlleur angular
$scope.resultat =  t$scope.totalgeolocaliser - ($scope.totalsupportvalide + $scope.totalItems)

// template html
<h1 class="fs35 mbn" ng-bind="resultat"></h1>
romses
Auteur

Merci Defy,
j'ai eu trop de support qui m'on peut être simplifier la vie mais ne respectait pas la logique de base. Merci

ca ira mieux avec [un style guide](john papa angularjs style guide) cest le style guide de john papa et ses recommandations pour developper correctement avec angularjs