Πώς να εκτελέσετε τη λειτουργία του ελεγκτή AngularJS κατά τη φόρτωση της σελίδας;

Προς το παρόν έχω μια σελίδα Angular.js που επιτρέπει την αναζήτηση και εμφανίζει τα αποτελέσματα. Ο χρήστης κάνει κλικ σε ένα αποτέλεσμα αναζήτησης και στη συνέχεια κάνει κλικ στο κουμπί back. Θέλω να εμφανιστούν ξανά τα αποτελέσματα της αναζήτησης, αλλά δεν μπορώ να βρω πώς να ενεργοποιήσω την εκτέλεση της αναζήτησης. Ακολουθούν οι λεπτομέρειες:

  • Η σελίδα μου Angular.js είναι μια σελίδα αναζήτησης, με ένα πεδίο αναζήτησης και μια αναζήτηση κουμπί αναζήτησης. Ο χρήστης μπορεί να πληκτρολογήσει χειροκίνητα ένα ερώτημα και να πατήσει ένα κουμπί και και το ερώτημα ajax πυροδοτείται και εμφανίζονται τα αποτελέσματα. Ενημερώνω τη διεύθυνση URL με τον όρο αναζήτησης. Όλα αυτά λειτουργούν μια χαρά.
  • Ο χρήστης κάνει κλικ σε ένα αποτέλεσμα της αναζήτησης και μεταφέρεται σε μια διαφορετική σελίδα - και αυτό λειτουργεί επίσης καλά.
  • Ο χρήστης κάνει κλικ στο κουμπί επιστροφής και επιστρέφει στη σελίδα αναζήτησης της γωνιακής μου εφαρμογής και εμφανίζεται η σωστή διεύθυνση URL, συμπεριλαμβανομένου του όρου αναζήτησης. Όλα λειτουργούν κανονικά.
  • Έχω δεσμεύσει την τιμή του πεδίου αναζήτησης με τον όρο αναζήτησης στη διεύθυνση URL, ώστε να περιέχει τον αναμενόμενο όρο αναζήτησης. Όλα λειτουργούν μια χαρά.

Πώς μπορώ να κάνω τη λειτουργία αναζήτησης να εκτελεστεί ξανά χωρίς ο χρήστης να χρειάζεται να πατήσει το κουμπί "αναζήτηση"; Αν ήταν jquery τότε θα εκτελούσα μια συνάρτηση στη συνάρτηση documentready. Δεν μπορώ να δω το αντίστοιχο της Angular.js.

Roshana Pitigala
Επεξεργασμένη ερώτηση Κάνε Ιούνιος 2018 в 12:43
Προγραμματισμός
angularjs onload
Κάνε Μάρτιος 2013 в 7:43
23 προβολές
Λύση

Από τη μία πλευρά, όπως είπε ο @Mark-Rajcok, μπορείτε να ξεφύγετε με την ιδιωτική εσωτερική λειτουργία:

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

Επίσης, μπορείτε να ρίξετε μια ματιά στην οδηγία ng-init. Η υλοποίηση θα είναι περίπου όπως:

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

Αλλά προσέξτε το καθώς η angular documentation υπονοεί (από την v1.2) να ΜΗΝ χρησιμοποιείτε το ng-init για αυτό. Ωστόσο imo εξαρτάται από την αρχιτεκτονική της εφαρμογής σας.

Χρησιμοποίησα το ng-init όταν ήθελα να περάσω μια τιμή από το back-end στην angular εφαρμογή:

<div data-ng-controller="myCtrl" data-ng-init="init('%some_backend_value%')"></div>
Dmitry Evseev
Επεξεργασμένη απάντηση Κάνε Δεκέμβριος 2013 в 10:33
Σχόλια (9)

Δοκίμασε αυτό;

$scope.$on('$viewContentLoaded', function() {
    //call it here
});
Σχόλια (5)

Μπορείτε να το κάνετε αυτό αν θέλετε να παρακολουθείτε το αντικείμενο viewContentLoaded DOM να αλλάζει και στη συνέχεια να κάνετε κάτι.Η χρήση του $scope.$on λειτουργεί επίσης, αλλά με διαφορετικό τρόπο, ειδικά όταν έχετε λειτουργία μίας σελίδας στη δρομολόγησή σας. 

 $scope.$watch('$viewContentLoaded', function(){
    // do something
 });
Σχόλια (1)