wake-up-neo.com

Aktuellen Status neu laden - Daten aktualisieren

Ich verwende Angular UI Router und möchte den aktuellen Status neu laden und alle Daten aktualisieren/die Controller für den aktuellen Status und den übergeordneten Status erneut ausführen.

Ich habe 3 Zustandsstufen: directory.organizations.details

directory.organisations enthält eine Tabelle mit einer Liste von Organisationen. Wenn Sie auf einen Artikel in der Tabelle klicken, wird directory.organisations.details geladen, wobei $ StateParams die ID des Artikels übergibt. Im Detailstatus lade ich die Details für diesen Artikel, bearbeite sie und speichere dann die Daten. Alles in Ordnung soweit.

Jetzt muss ich diesen Zustand neu laden und alle Daten aktualisieren.

Ich habe versucht:

 $state.transitionTo('directory.organisations');

Was in den übergeordneten Zustand geht, aber den Controller nicht neu lädt, denke ich, weil sich der Pfad nicht geändert hat. Im Idealfall möchte ich nur im directory.organisations.details Status bleiben und auch alle Daten im übergeordneten Element aktualisieren.

Ich habe auch versucht:

$state.reload()

Ich habe dies auf dem API-WIKI für $ state.reload gesehen "(Fehler, bei dem die Controller gerade neu gestartet werden, bald behoben)."

Jede Hilfe wäre dankbar?

321
Holland Risley

Diese Lösung funktioniert in AngularJS V.1.2.2:

$state.transitionTo($state.current, $stateParams, {
    reload: true,
    inherit: false,
    notify: true
});
149
Holland Risley

Ich fand, dass dies der kürzeste Weg ist, um mit dem UI-Router zu aktualisieren:

$state.go($state.current, {}, {reload: true}); //second parameter is for $stateParams

Update für neuere Versionen:

$state.reload();

Welches ist ein Alias ​​für:

$state.transitionTo($state.current, $stateParams, { 
  reload: true, inherit: false, notify: true
});

Dokumentation: https://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state#methods_reload

546
Rohan

Das wäre die endgültige Lösung. (inspiriert von @ Hollan_Risleys Post)

'use strict';

angular.module('app')

.config(function($provide) {
    $provide.decorator('$state', function($delegate, $stateParams) {
        $delegate.forceReload = function() {
            return $delegate.go($delegate.current, $stateParams, {
                reload: true,
                inherit: false,
                notify: true
            });
        };
        return $delegate;
    });
});

Rufen Sie jetzt einfach an, wann immer Sie neu laden müssen:

$state.forceReload();
67
M K

für ionic Framework

$state.transitionTo($state.current, $state.$current.params, { reload: true, inherit: true, notify: true });//reload

$stateProvider.
  state('home', {
    url: '/',
    cache: false, //required

https://github.com/angular-ui/ui-router/issues/582

56
RouR

Wahrscheinlich wäre der sauberere Ansatz der folgende:

<a data-ui-sref="directory.organisations.details" data-ui-sref-opts="{reload: true}">Details State</a>

Wir können den Status nur aus dem HTML-Code neu laden.

44

@Holland Risleys Antwort ist jetzt als API im neuesten UI-Router verfügbar.

$state.reload();

Eine Methode, die das erneute Laden des aktuellen Status erzwingt. Alle Auflösungen werden erneut aufgelöst, Controller werden erneut instanziiert und Ereignisse werden erneut ausgelöst.

http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state

$state.go($state.current, $stateParams, {reload: true, inherit: false});
15
Weston Ganger
$scope.reloadstat = function () { $state.go($state.current, {}, {reload: true}); };
9
user7961355

wenn Sie Ihre gesamte Seite neu laden möchten, wie es scheint, fügen Sie einfach $ window in Ihren Controller ein und rufen Sie dann auf

$window.location.href = '/';

wenn Sie jedoch nur Ihre aktuelle Ansicht neu laden möchten, fügen Sie $ scope, $ state und $ stateParams ein (letzteres nur für den Fall, dass Sie bei diesem bevorstehenden Neuladen einige Parameter ändern müssen, etwa Ihre Seitenzahl), und rufen Sie dies in any auf Controller-Methode:

$stateParams.page = 1;
$state.reload();

AngularJS v1.3.15 Angular-UI-Router v0.2.15

6
MarcoSantana

Dumme Problemumgehung, die immer funktioniert.

$state.go("otherState").then(function(){
     $state.go("wantedState")
});
4
Fanchi

Für mich ist alles gescheitert. Das einzige, was funktioniert hat, ist das Hinzufügen von cache-view = "false" zu der Ansicht, die ich neu laden möchte, wenn ich dorthin gehe.

von dieser Ausgabe https://github.com/angular-ui/ui-router/issues/582

2
Hans

Ich bin mir nicht sicher, warum keines davon bei mir zu wirken schien. der, der es endlich tat, war:

$state.reload($state.current.name);

Dies war mit Angular 1.4.0

2
BarrySW19

Für angular v1.2.26 funktioniert keines der oben genannten Verfahren. Ein ng-Klick, der die oben genannten Methoden aufruft, muss angeklickt werden zweimal, um den Status neu zu laden.

Also habe ich 2 Klicks mit $ timeout emuliert.

$provide.decorator('$state',
        ["$delegate", "$stateParams", '$timeout', function ($delegate, $stateParams, $timeout) {
            $delegate.forceReload = function () {
                var reload = function () {
                    $delegate.transitionTo($delegate.current, angular.copy($stateParams), {
                        reload: true,
                        inherit: true,
                        notify: true
                    })
                };
                reload();
                $timeout(reload, 100);
            };
            return $delegate;
        }]);
2
thanos panousis

Sie können @Rohan answer https://stackoverflow.com/a/23609343/3297761 verwenden

Aber wenn Sie jeden Controller nach einer Ansichtsänderung neu laden möchten, können Sie verwenden

myApp.config(function($ionicConfigProvider) { $ionicConfigProvider.views.maxCache(0); ... }
1
EduLopez

Ich hatte mehrere verschachtelte Ansichten und das Ziel war, nur eine mit Inhalt neu zu laden. Ich habe verschiedene Ansätze ausprobiert, aber das einzige, was für mich funktioniert hat, ist:

//to reload
$stateParams.reload = !$stateParams.reload; //flip value of reload param
$state.go($state.current, $stateParams);

//state config
$stateProvider
  .state('app.dashboard', {
    url: '/',
    templateUrl: 'app/components/dashboard/dashboard.tmpl.html',
    controller: 'DashboardController',
    controllerAs: 'vm',
    params: {reload: false} //add reload param to a view you want to reload
  });

In diesem Fall wird nur die benötigte Ansicht neu geladen und das Caching funktioniert weiterhin.

1

Wenn Sie ionic v1 verwenden, funktioniert die obige Lösung nicht, da ionic das Vorlagen-Caching als Teil von $ ionicConfigProvider aktiviert hat.

Die Umgehung des Problems ist etwas schwierig - Sie müssen den Cache in der Datei ionic.angular.js auf 0 setzen:

$ionicConfigProvider.views.maxCache(0);
1
Maksood

Ich weiß, dass es eine Reihe von Antworten gibt, aber der beste Weg, dies zu tun, ohne eine vollständige Seitenaktualisierung zu verursachen, besteht darin, einen Dummy-Parameter auf der Route zu erstellen, die ich aktualisieren möchte, und dann, wenn ich die Route aufrufe, die ich in a übergebe Zufallszahl für den Dummy-Parameter.

            .state("coverage.check.response", {
                params: { coverageResponse: null, coverageResponseId: 0, updater: 1 },
                views: {
                    "coverageResponse": {
                        templateUrl: "/Scripts/app/coverage/templates/coverageResponse.html",
                        controller: "coverageResponseController",
                        controllerAs: "vm"
                    }
                }
            })

und dann der Aufruf dieser Route

$state.go("coverage.check.response", { coverageResponse: coverage, updater: Math.floor(Math.random() * 100000) + 1 });

Funktioniert wie ein Zauber und kümmert sich um die Auflösungen.

1
ewahner

Ich hatte das Problem, dass es meinen Kopf ruinierte, mein Routing wird aus einer JSON-Datei gelesen und dann in eine Direktive eingespeist. Ich konnte auf einen UI-Status klicken, aber die Seite nicht neu laden. Ein Kollege von mir hat mir einen netten kleinen Trick gezeigt.

  1. Holen Sie sich Ihre Daten
  2. Erstellen Sie in Ihrer Apps-Konfiguration einen Ladezustand
  3. Speichern Sie den gewünschten Status im Rootscope.
  4. Setzen Sie Ihren Standort in Ihrer app.run auf "/ loading"
  5. Lösen Sie im Ladecontroller das Routing-Versprechen und setzen Sie den Standort auf Ihr beabsichtigtes Ziel.

Das hat bei mir funktioniert.

Ich hoffe es hilft

0
Evan Burbidge