Angular.js - comment exécuter la fonction de chargement de la page?

Question

Actuellement, j'ai un Angular.js la page qui permet la recherche et affiche les résultats. L'utilisateur clique sur un résultat de recherche, les clics de bouton de retour. Je veux les résultats de la recherche pour l'afficher à nouveau, mais je ne peux pas savoir comment déclencher la recherche à exécuter. Voici le détail:

• Mon Angular.js la page est une page de recherche, avec un champ de recherche et une recherche bouton. L'utilisateur peut taper manuellement dans une requête et appuyez sur un bouton et et la requête ajax est tiré et que les résultats sont affichés. - Je mettre à jour l'URL avec le terme de recherche. Que tous fonctionne bien.
• L'utilisateur clique sur un résultat de la recherche et est pris à une page différente - qui fonctionne très bien aussi.
• L'utilisateur clique sur le bouton retour, et remonte à mon angulaire de la page de recherche, et que l'URL est correcte est affichée, y compris le terme de recherche. Tout fonctionne très bien.
• J'ai lié le champ de recherche de la valeur pour le terme de recherche dans l'URL, donc il contient la attendue terme de recherche. Tout fonctionne très bien.

Comment puis-je obtenir la fonction de recherche pour exécuter à nouveau sans que l'utilisateur ait à appuyer sur le "bouton de recherche"? Si c'était jquery, alors je voudrais exécuter une fonction dans le documentready fonction. Je ne peux pas voir le Angular.js l'équivalent.

Answer 1

D'une part, comme @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 en tant angulaire de la documentation implique (depuis v1.2) de ne PAS utiliser ng-init . 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 de l'app:

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

Answer 2

Essayez ceci?

$scope.$on('$viewContentLoaded', function() {
    //call it here
});

Answer 3

En raison de ces:

• Je n'ai jamais pu obtenir $viewContentLoaded de travailler pour moi
• ng-init devrait vraiment être utilisé dans une ng-repeat (selon la documentation)
• 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
});

Answer 4

Dimitri/Marque de la solution n'a pas fonctionné pour moi, mais à l'aide de l' $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érons que cela aide.

Answer 5

Vous pouvez le faire si vous voulez regarder la viewContentLoaded DOM objet de modifier et de faire quelque chose. à l'aide de $scope.$sur fonctionne aussi, mais différemment, surtout quand vous avez une page mode de routage.

 $scope.$watch('$viewContentLoaded', function(){
    // do something
 });