Hur körs AngularJS-kontrollfunktion vid sidladdning?

För närvarande har jag en Angular.js-sida som tillåter sökning och visar resultat. Användaren klickar på ett sökresultat och klickar sedan på knappen Tillbaka. Jag vill att sökresultaten ska visas igen men jag kan inte komma på hur jag ska utlösa sökningen för att utföra den. Här är detaljerna:

  • Min Angular.js-sida är en söksida med ett sökfält och en sökfunktion. knapp. Användaren kan manuellt skriva in en fråga och trycka på en knapp och och en ajax-fråga avfyras och resultaten visas. Jag uppdaterar webbadressen med sökbegreppet. Allt fungerar bra.
  • Användaren klickar på ett resultat av sökningen och tas till en annan sida - det fungerar också bra.
  • Användaren klickar på knappen tillbaka och går tillbaka till min angulära söksida, och rätt URL visas, inklusive sökbegreppet. Allt fungerar bra.
  • Jag har bundit sökfältets värde till sökbegreppet i URL:en, så det innehåller det förväntade sökbegreppet. Allt fungerar bra.

Hur får jag sökfunktionen att köras igen utan att användaren behöver trycka på "sök-knappen"? Om det var jquery skulle jag exekvera en funktion i documentready-funktionen. Jag kan'inte se Angular.js motsvarighet.

Lösning

Å ena sidan kan du, som @Mark-Rajcok sa, komma undan med privata inre funktioner:

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

Du kan också ta en titt på ng-init direktivet. Genomförandet kommer att vara ungefär som:

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

Men var försiktig med det eftersom [angular dokumentation antyder (sedan v1.2)] (http://docs.angularjs.org/api/ng.directive:ngInit) att INTE använda ng-init för detta. Men imo beror det på arkitekturen i din app.

Jag använde ng-init när jag ville skicka ett värde från back-end till angular app:

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

Prova det här?

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

Du kan göra det här om du vill se hur DOM-objektet viewContentLoaded ändras och sedan göra något.Att använda $scope.$on fungerar också, men på olika sätt, särskilt när du har ett sidoläge i din routing.

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