Question

我是Ionic的初学者，我正在开发一个应用程序，要求用户在下订单之前登录。现在，如果用户尝试下订单而他未登录，则需要一种逻辑，可以将他重定向到登录页面，并在成功后可以将他重定向到订单页面。在Android中使用启动活动获取结果可能是可能的。但是如何在Ionic中实现呢？我有一个使用模式打开登录页面并在成功后将其关闭的解决方案，但是我现在不希望实现该解决方案。

Answer 1

这里是通过登录打开模式的示例。 在使用下面的代码之前，应先调整路径和IonicPage 。也许您可以从代码中获得要点。

home.ts

import { Component } from '@angular/core';
import { AuthProvider } from '../../providers/auth/auth.provider'

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  constructor(public authService:AuthProvider) {

  }

  goToOrder(){
    this.authService.openModalViaLogin('OrderPage', {}, ()=>{})
  }
}

login.ts

import { Component } from '@angular/core';
import { IonicPage, ViewController } from 'ionic-angular';
import { AuthProvider } from '../../providers/auth/auth.provider';

@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage {

  constructor(public authService:AuthProvider, public viewCtrl:ViewController) {
  }

  login(){
    this.authService.isAuthenticated = true;
    this.viewCtrl.dismiss()
  }

  close(){
    this.viewCtrl.dismiss()
  }

}

auth.provider.ts

import { Injectable } from '@angular/core';
import { ModalController } from 'ionic-angular';

@Injectable()
export class AuthProvider {
  public isAuthenticated:boolean = false;

  constructor(public modalCtrl:ModalController) {
    console.log('Hello AuthProvider Provider');
  }

  public openModalViaLogin(modalPage:string, params:any, callbackOnDidDismissed:Function){
    if(this.isAuthenticated){
      let modal = this.modalCtrl.create(modalPage,params)
      modal.onDidDismiss(()=>{
        callbackOnDidDismissed()
      })
      modal.present()
    }else{
      let loginModal = this.modalCtrl.create('LoginPage')
      loginModal.onDidDismiss(()=>{
        if(this.isAuthenticated){
          let modal = this.modalCtrl.create(modalPage,params)
          modal.onDidDismiss(()=>{
            callbackOnDidDismissed()
          })
          modal.present()
        }else{
          console.log("failed to authenticate")
        }
      })
      loginModal.present()
    }
  }
}

p.s。我认为nav有一种更灵活的方法来实现它，但是这可能会使这个简短的答案感到困惑。

开始活动结果离子3

1 个答案: