Comment exécuter AngularJS contrôleur de fonction au chargement de la page?

D'une part de @Marc-Rajcok dit, vous pouvez tout simplement obtenir loin avec intérieure privée fonction:

//at the bottom of your controller
var init = function () {
   //check if there is query in url
   //and fire search in case its value is not empty
};
//and fire it after definition
init();

Aussi, vous pouvez prendre un coup d'oeil à ng-init directive. La mise en œuvre sera un peu comme:

//register controller in html
<div data-ng-controller="myCtrl" data-ng-init="init()"></div>

//in controller
$scope.init = function () {
    //check if there is query in url
    //and fire search in case its value is not empty
};

Mais prendre soin à ce sujet que angulaire de la documentation implique (depuis v1.2) de ne PAS utiliser ng-init pour que. Cependant omi cela dépend de l'architecture de votre application.

J'ai utilisé ng-init quand j'ai voulu passer d'une valeur à partir de l'arrière-end dans angulaire application:

<div data-ng-controller="myCtrl" data-ng-init="init('%some_backend_value%')"></div>

Je n'ai jamais pu obtenir $viewContentLoaded de travailler pour moi, et ng-init devrait vraiment être utilisé dans un ng-repeat (selon la documentation), et aussi l'appel d'une fonction directement dans un contrôleur peut provoquer des erreurs si le code s'appuie sur un élément qui n'a pas encore été définie.

C'est ce que je fais et ça fonctionne pour moi:

$scope.$on('$routeChangeSuccess', function () {
  //do something
});

Sauf si vous utilisez ui-router. Ensuite, c'est:

$scope.$on('$stateChangeSuccess', function () {
  //do something
});

Dimitri/Marque de la solution n'a pas fonctionné pour moi, mais à l'aide de la $timeout fonction semble bien fonctionner pour assurer que votre code ne s'exécute après le balisage est rendu.

# Your controller, including $timeout

var $scope.init = function(){
 //your code
}

$timeout($scope.init)

Espère que cela aide.

Vous pouvez utiliser angulaire de dollars de la fenêtre de l'objet:

$window.onload = function(e) {
  //your magic here
}

Encore une autre alternative si vous avez un contrôleur spécifique à cette page:

(function(){
    //code to run
}());

Trouvé Dmitry Evseev réponse très utile.

Cas 1 : Utilisation d'angularJs seul:

À l'exécution d'une méthode de chargement de la page, vous pouvez utiliser ng-init dans la vue et de déclarer la méthode init dans le contrôleur, après avoir dit que l'utilisation de plus lourds fonction n'est pas recommandé, comme par le angulaire Docs sur ng-init:

La présente directive peuvent être utilisés pour ajouter inutile montants de logique dans vos modèles. Il y a seulement quelques utilisations appropriées de ngInit, comme pour l'aliasing propriétés spéciales de ngRepeat, comme on le voit dans la démo ci-dessous; et pour injecter des données via des scripts côté serveur. En dehors de ces quelques cas, vous devez utiliser les contrôleurs plutôt que ngInit pour initialiser les valeurs d'un champ.

HTML:

<div ng-controller="searchController()">
    <!-- renaming view code here, including the search box and the buttons -->
</div>

Contrôleur:

app.controller('SearchCtrl', function(){

    var doSearch = function(keyword){
        //Search code here
    }

    doSearch($routeParams.searchKeyword);
})

Avertissement : de Ne pas utiliser ce contrôleur pour un autre point de vue sur une intention différente, comme il sera la cause de la méthode de recherche sera exécutée il y a aussi.

Cas 2 : Utilisation Ionique:

Le code ci-dessus fonctionne, assurez-vous que le cache est désactivé dans le route.js comme:

route.js

.state('app', {
    url           : '/search',
    cache         : false, //disable caching of the view here
    templateUrl   : 'templates/search.html'   ,
    controller    : 'SearchCtrl'
  })

Espère que cette aide

Vous pouvez enregistrer les résultats de la recherche dans un service commun qui peut l'utiliser à partir de n'importe où et n'est pas évident quand accédez à une autre page, et puis vous pouvez définir les résultats de la recherche avec les données enregistrées pour le clic de bouton de retour

function search(searchTerm) {
    //retrieve the data here;
    RetrievedData = CallService();
    CommonFunctionalityService.saveSerachResults(RetrievedData);
} 

Pour votre backbutton

function Backbutton() {
    RetrievedData = CommonFunctionalityService.retrieveResults();
}