Question

我想在登录facebook后导航到另一个页面。现在我可以使用Facebook登录并保持在同一页面上，但我想导航到另一个页面。

我的.html文件是

<button ion-button full (click)="loginWithFB()">Login!</button> 
<ion-card *ngIf="userData; else facebookLogin">
  <ion-card-header>{{ userData.username }}</ion-card-header>
  <img [src]="userData.picture" />
  <ion-card-content>
    <p>Email: {{ userData.email }}</p>
    <p>First Name: {{ userData.first_name }}</p>
  </ion-card-content>
</ion-card>

我的.ts文件是

loginWithFB() {
  this.facebook.login(['email', 'public_profile']).then((response: FacebookLoginResponse) => {
    this.facebook.api('me?fields=id,name,email,first_name,picture.width(720).height(720).as(picture_large)', []).then(profile => {
      this.userData = {email: profile['email'], first_name: profile['first_name'], picture: profile['picture_large']['data']['url'], username: profile['name']}
    });
  }); 
}

Answer 1

您只需要在Facebook登录电话后返回的承诺中使用navController推送页面：

this.facebook.api('me?fields=id,name,email,first_name,picture.width(720).height(720).as(picture_large)', []).then(profile => {
  this.userData = {email: profile['email'], first_name: profile['first_name'], picture: profile['picture_large']['data']['url'], username: profile['name']};
  this.navCtrl.push(PageName, PageParametersIfAny);
});

推送页面的方法有两种：

如果您没有延迟加载应用程序，请直接从其文件导入页面。
只是传递包含页面名称的字符串，如果它是延迟加载的。

如果没有延迟加载，就像这样：

import { MyPage } from 'path/to/my/page/folder'; 

...
this.navCtrl.push(MyPage);

或者如果延迟加载：

this.navCtrl.push('MyPage'); // There's no import

希望这有帮助。

在Ionic 3中使用Facebook登录后如何导航到另一个页面

1 个答案: