Come eseguire la funzione del controller AngularJS al caricamento della pagina?

Attualmente ho una pagina Angular.js che permette la ricerca e visualizza i risultati. L'utente fa clic su un risultato di ricerca, quindi fa clic sul pulsante indietro. Voglio che i risultati della ricerca vengano visualizzati di nuovo, ma non riesco a capire come attivare l'esecuzione della ricerca. Ecco il dettaglio:

  • La mia pagina Angular.js è una pagina di ricerca, con un campo di ricerca e un pulsante di ricerca. L'utente può digitare manualmente una query e premere un pulsante e e la query ajax viene sparata e i risultati vengono visualizzati. Aggiorno l'URL con il termine di ricerca. Tutto funziona bene.
  • L'utente clicca su un risultato della ricerca e viene portato su una pagina diversa - anche questo funziona bene.
  • L'utente fa clic sul pulsante indietro, e torna alla mia pagina di ricerca angolare, e viene visualizzato l'URL corretto, compreso il termine di ricerca. Tutto funziona bene.
  • Ho legato il valore del campo di ricerca al termine di ricerca nell'URL, quindi contiene il termine di ricerca previsto. Tutto funziona bene.

Come faccio a far eseguire di nuovo la funzione di ricerca senza che l'utente debba premere il "pulsante di ricerca"? Se fosse jquery allora eseguirei una funzione nella funzione documentready. Non riesco a vedere l'equivalente in Angular.js.

Roshana Pitigala
Domanda modificata 22º giugno 2018 в 12:43
Programmazione
angularjs onload
17º marzo 2013 в 7:43
18 visualizzazioni
Soluzione

Da un lato, come ha detto @Mark-Rajcok, si può semplicemente cavarsela con una funzione interna privata:

// 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();

Inoltre puoi dare un'occhiata alla direttiva ng-init. L'implementazione sarà molto simile:

// 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
};

Ma fai attenzione come la documentazione angolare implica (dalla v1.2) per NON usare ng-init per questo. Tuttavia imo dipende dall'architettura della tua app.

Ho usato ng-init quando volevo passare un valore dal back-end nell'app angolare:

<div data-ng-controller="myCtrl" data-ng-init="init('%some_backend_value%')"></div>
Dmitry Evseev
Risposta modificata 8º dicembre 2013 в 10:33
Commentari (9)

Provare questo?

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

Puoi farlo se vuoi guardare l'oggetto DOM viewContentLoaded cambiare e poi fare qualcosa. usando $scope.$on funziona anche, ma in modo diverso, specialmente quando hai una modalità pagina sul tuo routing. 

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