Ioni c: this.router.getCurrentNavigation (). Extras.state не определено

Question

Я снова спрашиваю о вашей поддержке программирования.

Позвольте мне объяснить, мои проблемы и мой контекст. В ioni c мне нужно создать мобильное приложение с вкладками, которое сначала попросит вас ввести логин / пароль для подключения. Когда пользователь нажимает кнопку подключения, он сначала проверяет правильность логина / пароля, а затем отправляет данные логина / пароля компонентам вкладок, которые отправляют запрос с данными логина / пароля для получения статей логина и пароля. пароль пользователя.

Вам необходимо знать две вещи:

1. моя страница входа - это модальное окно, созданное компонентами вкладок
2. I используйте NavigationExtras / Extra State для отправки данных на другую страницу, но я делаю это только тогда, когда пользователь нажимает кнопку, чтобы в конструкторе модальной страницы ничего не было

Итак, после создать модальные nn вкладки, я жду данных из router.navigate только при нажатии кнопки в модальных моделях, к сожалению, конструктор вкладок не будет ждать нажатия кнопки, поэтому у меня закончилось this.router.getCurrentNavigation () .extras.state как неопределенное во вкладках

Как предотвратить это и заставить компоненты вкладок ждать кнопку страницы модальных нажать для отправки необходимых данных?

Вот код:

tabs.page.ts

    export class TabsPage {

  donnee_article: any;
  login: string;
  password: string;

  constructor(private http: HttpClient,public modalController: ModalController,private route: ActivatedRoute, private router: Router) 
  {
    console.log("create modal");
    this.presentModal(); // on affiche le modal

    if (this.reponse_connexion(this.login,this.password) == true)
    {
      this.http.get('http://www.sebastien-thon.fr/cours/M4104Cip/projet/index.php?login='+this.login+'&mdp='+this.password).subscribe((data) => 
      {
        this.donnee_article = data;
        console.log(this.donnee_article);
      }); 
    }
    console.log(this.login);
    console.log(this.password);

  }

  reponse_connexion(login, password)
  {
    console.log("router " + this.router.getCurrentNavigation().extras.state)
    if (this.router.getCurrentNavigation().extras.state)
    {
      this.login = this.router.getCurrentNavigation().extras.state.login_classe;
      this.password = this.router.getCurrentNavigation().extras.state.password_classe;

      if (typeof this.login != "undefined" && this.password != undefined)
      {
        console.log("true");
        return true;
      }
      else
      {
        console.log("false");
        return false;
      }
    }

  }
  async presentModal() 
  {
    const modal = await this.modalController.create({
      component: ConnexionPage
    });
    return await modal.present();
  }

connexion.page.ts

export class ConnexionPage implements OnInit {

  requete: any; // varaible stockée la réponse du serveur
  login  : string; // représente le login du premier input 
  password: string; // représente le mot de passe du deuxième input
  message_warning: string; // représente la boite de message en cas de réponse de la requête

  constructor(private http: HttpClient, private modalCtrl:ModalController, public alertController: AlertController, public router: Router) 
  {

  }

  Connexion_classe()
  {
    console.log(this.login);
    console.log(this.password);
    this.http.get('http://www.sebastien-thon.fr/cours/M4104Cip/projet/index.php?connexion&login='+this.login+'&mdp='+this.password)
    .subscribe((data) => 
    {
      this.requete = data;
      if (this.requete.erreur === "Login ou mot de passe incorrect") // si la reponse du serveur donne une erreur
      {
        this.message_warning = this.requete.erreur; // le message_warning devient le message d'erreur
        this.presentAlert(); // on active la fonction pour mettre l'alerte
        this.login = ""; // on remet le champ login vide
        this.password = ""; // on remet le champ password vide
      }
      else // sinon si la reponse du serveur est bonne cad on a marqué un login et password correcte alors:
      {
        // on envoie le login et password aux tabs pour qu'ils recupérent la liste d'article avec notre login et password
        let navigationExtras: NavigationExtras = {
          state:
          {
            login_classe: this.login,
            password_classe: this.password
          }
        }
        this.router.navigate(['tabs'], navigationExtras);
        console.log("bye modal");
        this.modalCtrl.dismiss();
      }
    });

  }

  async presentAlert() {
    const alert = await this.alertController.create({
      header: 'Connexion échouée',
      subHeader: 'Erreur:',
      message: this.message_warning,
      buttons: ['OK']
    });

    await alert.present();
  }

заранее спасибо, жду ваших ответов

Answer 1

modalController не отправляет данные в состоянии. Поэтому вам нужно подождать, пока ваш modalController вернет данные.

 async presentModal() {
  const modal = await this.modalController.create({
    component: ConnexionPage
  });
 await modal.present();

const datafromModal = await modal.onDidDismiss();  // wait till modal not returned the data

//then call here function
 if (this.reponse_connexion(this.login,this.password) == true){
 // logic part
}

И нужно передать данные в режиме модального смещения вместо состояния маршрутизатора

 let data = { 'foo': 'bar' };
 this.viewCtrl.dismiss(data);

и будет доступен на вкладке в переменной datafromModal