MVC, Angular i redirect

Kontynuując tworzenie aplikacji BoardGamesNook natknęłam się na pewien problem. Mianowicie chciałam, żeby po zalogowaniu się, użytkownik nie przechodził do strony głównej programu, ale musiał wypełnić pewne wymagane dane dla obiektu gracza. Dopiero po ich wypełnieniu mógłby korzystać z aplikacji.

Opis problemu: mam UserController i GamerController. Muszę je połączyć w jakiś sposób. To znaczy, że po zalogowaniu się użytkownika w kontrolerze User, należy przejść do metody dodającej gracza w kontrolerze Gamer. Jak się za to zabrać?

Stwierdziłam, że skoro moja aplikacja korzysta ze wzorca MVC, to może by skorzystać z metody RedirectToAction(). Wtedy z dowolnego kontrolera (UserController) mogłabym się przenieść do innego (GamerController) i wywołać odpowiednią metodę (AddGamer). Okazało się, że jest jeden problem – zwracam widok AddGamer.cshtml, a to się nie podoba Angularowi. Czemu? Ponieważ Angular z wbudowanym routingiem sam zajmuje się renderowaniem widoków. Musiałam więc przenieść część logiki do strony frontendowej. Mianowicie w pliku app.component.ts podczas ładowania aplikacji musiałam sprawdzić następujące rzeczy:

drzewo

Dla zainteresowanych – takie proste grafy można wykonać w darmowej aplikacji Dia.

Zatrzymałam się na etapie sprawdzania gracza dla użytkownika. Dodałam więc sprawdzanie, czy istnieje odpowiedni gracz i przeniesienie do odpowiedniej akcji już w Angularze. Wygląda to następująco:


ngOnInit() {
 this.userService.getUser().then((user: User) => {
  this.user = user;
  if (this.user != null) {
   this.gamerService.getByEmail(this.user.Email)
    .then((gamer: Gamer) => { this.gamer = gamer });
   if (this.gamer == null) {
    this.router.navigate(["/gamer", 0]);
   }
  }
 });
}

Zostało mi jeszcze obsłużyć dodawanie nowego gracza i przeniesienie do strony głównej aplikacji. Małymi kroczkami idę więc do przodu:)

Jedna uwaga do wpisu “MVC, Angular i redirect

Dodaj komentarz