wake-up-neo.net

winkel 2: Laden Sie dieselbe Komponente erneut, wenn Sie auf derselben Route umleiten

Ich verwende 'routerLink', um auf meinen Routen zu navigieren, und es funktioniert einwandfrei. Wenn ich jedoch erneut auf dieselbe Schaltfläche klicke, möchte ich, dass die Komponente erneut geladen wird. Momentan funktioniert es aber nicht in angle2.

app.component.html

<ul class="nav navbar-nav navbar-right">
            <li><a [routerLink]="['/events']" routerLinkActive="active" [routerLinkActiveOptions]="{exact:true}">All Events</a></li>
            <li><a [routerLink]="['/events/new']" routerLinkActive="active" [routerLinkActiveOptions]="{exact:true}">Create New</a></li>
</ul>

Ich möchte, Wenn ich immer auf die Registerkarte "Alle Ereignisse" klicke, wird die Ereigniskomponente jedes Mal geladen. 

Wie erreicht man dieses Szenario in angle2?

5
Er Vipin Sharma

Ich möchte, Wenn ich immer auf die Registerkarte "Alle Ereignisse" klicke, wird die Ereigniskomponente jedes Mal geladen.

Dies ist Not Possible in angle2. Wenn Sie eine Komponente laden, wird die Komponente erst dann neu geladen, wenn Sie von einer anderen Route zu dieser Route wechseln.

Sie können aber kräftig nachladen 

Grundsätzlich gibt es zwei Methoden

  • sie können die ngOnInit()-Methode je nach Bedarf immer wieder aufrufen. Dies ist keine empfohlene Methode

  • sie können eine Commonn-Methode von ngOnInit() aus aufrufen und diese Funktion später erneut aufrufen

    ngOnInit(){
        this.callingFunction();
    }
    
    forLaterUse(){
        this.callingFunction(); 
    }
    

Eine andere Möglichkeit ist, wenn Sie dieselbe Komponente bei Parameteränderung laden möchten, können Sie dies im Konstruktor verwenden

this.route.params.subscribe((params: Params) => {
    console.log(params); 
    this.callingFunction();
    // this will be called every time route changes
    // so you can perform your functionality here

});
5
Pardeep Jain

Dieser untenstehende github-Link hat die richtige Lösung https://github.com/angular/angular/issues/13831

Fügen Sie den folgenden Code in den Konstruktor der Komponente ein, die Sie laden möchten

this.router.routeReuseStrategy.shouldReuseRoute = function () {
  return false;
};

this.router.events.subscribe((evt) => {
  if (evt instanceof NavigationEnd) {
    this.router.navigated = false;
    window.scrollTo(0, 0);
  }
});
3
Anonymous

Siehe hier: So laden Sie die aktuelle Route mit dem 2-Winkel-Router neu

Zusammenfassend - es ist keine Funktion, die im Router integriert ist. Die beste Option ist die Verwendung eines Dienstes, der alle relevanten Daten aktualisiert oder abruft. Wenn sich etwas ändert, aktualisiert Angular die Ansicht automatisch. 

Wenn jemand sagt, dass in Angular etwas nicht möglich ist, stimmt das fast immer nicht. Es ist einfach nicht möglich, mit derzeit vorhandenen Lösungen. ;-)

1
diopside