Derzeit habe ich eine Angular.js-Seite, auf der gesucht und Ergebnisse angezeigt werden können. Der Benutzer klickt auf ein Suchergebnis und dann auf die Schaltfläche Zurück. Ich möchte, dass die Suchergebnisse erneut angezeigt werden, kann jedoch nicht herausfinden, wie die Ausführung der Suche ausgelöst wird. Hier ist das Detail:
- Meine Angular.js-Seite ist eine Suchseite mit einem Suchfeld und einer Suchschaltfläche. Der Benutzer kann eine Abfrage manuell eingeben und eine Taste drücken. Die Ajax-Abfrage wird ausgelöst und die Ergebnisse werden angezeigt. Ich aktualisiere die URL mit dem Suchbegriff. Das alles funktioniert gut.
- Der Benutzer klickt auf ein Ergebnis der Suche und wird auf eine andere Seite weitergeleitet - das funktioniert auch gut.
- Der Benutzer klickt auf die Schaltfläche "Zurück" und kehrt zu meiner Winkelsuchseite zurück. Die richtige URL wird angezeigt, einschließlich des Suchbegriffs. Alles funktioniert gut.
- Ich habe den Suchfeldwert an den Suchbegriff in der URL gebunden, sodass er den erwarteten Suchbegriff enthält. Alles funktioniert gut.
Wie kann ich die Suchfunktion erneut ausführen, ohne dass der Benutzer die "Suchtaste" drücken muss? Wenn es jquery wäre, würde ich eine Funktion in der documentready-Funktion ausführen. Ich kann das Angular.js-Äquivalent nicht sehen.
$routepProvider
? Verwenden Sie diese Option, um eine Verbindung zu einem Dienst in Ihrer App herzustellen, der Daten für die Suchergebnisse bereitstellt. Denken Sie nichtdocument.ready
wie bei jQuery. Es ist schwer, viel zu helfen, ohne zu sehen, wie Sie die Suche derzeit verkabelt habenAntworten:
Einerseits, wie @ Mark-Rajcok sagte, kann man einfach mit einer privaten inneren Funktion davonkommen:
Sie können sich auch die ng-init- Direktive ansehen . Die Implementierung wird ähnlich sein wie:
Aber seien Sie vorsichtig, da die eckige Dokumentation (seit Version 1.2) impliziert , dass Sie das NICHT verwenden sollten
ng-init
. Wie auch immer, es hängt von der Architektur Ihrer App ab.Ich habe verwendet,
ng-init
als ich einen Wert vom Back-End an die Winkel-App übergeben wollte:quelle
myCtrl
Controller erstellt und ausgeführt.<div smth on-init="doWhatever()">
. Natürlich hängt es von einem bestimmten Anwendungsfall ab.Versuche dies?
quelle
Ich konnte nie
$viewContentLoaded
für mich arbeiten undng-init
sollte eigentlich nur in einemng-repeat
(laut Dokumentation) verwendet werden. Auch das Aufrufen einer Funktion direkt in einem Controller kann zu Fehlern führen, wenn der Code auf einem Element basiert, das noch nicht definiert wurde .Das mache ich und es funktioniert für mich:
Es sei denn, Sie verwenden
ui-router
. Dann ist es:quelle
$scope.$on('$routeChangeSuccess'
wird jedes Mal ausgelöst, wenn Parameter in der URL geändert werden ($location
z. B. über), und daher können Sie nur verwenden$scope.$on('$locationChangeSuccess'
. Wenn Sie beim Laden / Neuladen einer Seite einen Auslöser benötigen, können Sie diesen$scope.$watch('$viewContentLoaded'
wie hier vorgeschlagen verwenden. Es wird nicht ausgelöst, wenn sich die URL-Parameter ändern.quelle
$scope
und stattdessen arbeitenthis
.Die Lösung von Dimitri / Mark hat bei mir nicht funktioniert, aber die Verwendung der $ timeout- Funktion scheint gut zu funktionieren, um sicherzustellen, dass Ihr Code erst ausgeführt wird, nachdem das Markup gerendert wurde.
Ich hoffe es hilft.
quelle
Sie können dies tun, wenn Sie das viewContentLoaded-DOM-Objekt beobachten möchten, um es zu ändern, und dann etwas tun möchten. Die Verwendung von $ scope. $ on funktioniert ebenfalls, jedoch anders, insbesondere wenn Sie einen Seitenmodus für Ihr Routing haben.
quelle
Sie können das $ window-Objekt von angle verwenden:
quelle
Eine andere Alternative:
(über https://stackoverflow.com/a/30258904/148412 )
quelle
Eine weitere Alternative, wenn Sie einen Controller haben, der nur für diese Seite spezifisch ist:
quelle
Wenn Sie $ routeProvider verwenden, können Sie .state auflösen und Ihren Dienst booten. Dies bedeutet, dass Sie Controller und View erst laden, nachdem Sie Ihren Dienst aufgelöst haben:
UI-Routen
Bedienung
quelle
Fand Dmitry Evseev Antwort sehr nützlich.
Fall 1: Verwenden von angleJs allein:
Um eine Methode beim Laden der Seite auszuführen, können Sie
ng-init
in der Ansicht die Methode init verwenden und deklarieren, obwohl die Verwendung einer schwereren Funktion gemäß den Angular Docs on ng-init nicht empfohlen wird :HTML:
Regler:
Warnung: Verwenden Sie diesen Controller nicht für eine andere Ansicht, die für eine andere Absicht bestimmt ist, da sonst die Suchmethode auch dort ausgeführt wird.
Fall 2: Verwenden von Ionic:
Der obige Code funktioniert. Stellen Sie einfach sicher, dass der Ansichtscache im
route.js
as deaktiviert ist :route.js
Hoffe das hilft
quelle
cache: false
hat es für mich getan - danke!Ich hatte das gleiche Problem und nur diese Lösung funktionierte für mich (sie führt eine Funktion aus, nachdem ein vollständiges DOM geladen wurde). Ich verwende dies zum Scrollen zum Ankern, nachdem die Seite geladen wurde:
quelle
Sie können die Suchergebnisse in einem allgemeinen Dienst speichern, der von überall verwendet werden kann und beim Navigieren zu einer anderen Seite nicht gelöscht wird. Anschließend können Sie die Suchergebnisse mit den gespeicherten Daten für die Schaltfläche "Zurück" festlegen
Für deinen Backbutton
quelle
Rufen Sie die Anfangsmethoden innerhalb der Selbstinitialisierungsfunktion auf.
quelle