Question

更新

实际上，我已在此doc上实现了“切换菜单”。请注意。切换菜单工作正常。但是当用户单击切换菜单时我需要获取最新的令牌。它仅适用于构造函数之后，我不能那样做。那可能是由于Root组件。我怎么能实现呢？

创建app.component.ts组件后，我可以访问哪个生命周期事件？第一次它会触发constructor()代码。但是之后没有任何生命周期事件正在运行。

我的方案：我在Ionic2应用程序上实现了如下所示的侧边菜单。

app.html

<ion-menu [content]="content">
  <ion-content padding>
   <img src="./assets/img/login.png" alt="Login" (click)="login()" *ngIf="token!=null && token.length==0" menuClose>

        //removed for clarity

    </ion-content>
</ion-menu>

<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

现在我需要在每次用户点击上面的菜单时获取令牌值。但它只能运行一次。之后，它不起作用。你能告诉我一个解决方法吗？

app.component.ts

export class MyApp extends HandleStorageService {
  @ViewChild(Nav) nav: Nav;
  rootPage = EventSchedulePage;
  menuList: Observable<any>;
  token: string = '';

  constructor(platform: Platform, public menuData: MenuData, public loadingCtrl: LoadingController, public storage: Storage) {
    super(storage);

    platform.ready().then(() => {
      StatusBar.styleDefault();
      Splashscreen.hide();
    });

    this.getMenuList();//menu list
  }

  ionViewDidEnter() {// not working this
    this.getToken().then((val) => {//get token
      this.token = val;
    });
  }

Answer 1

我将使用标记token而不是app.html。因此，您的<ion-menu [content]="content"> <ion-content padding> <img src="./assets/img/login.png" alt="Login" (click)="login()" *ngIf="!isLoggedIn" menuClose> //removed for clarity </ion-content> </ion-menu> <ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>会变成这样：

app.ts

现在在app.ts，您首先订阅这些活动。您可以从应用程序的任何位置发布这些事件。 app.ts中的这些订阅会在特定事件发布后立即触发。

import {Events} from 'ionic-angular'; export class MyApp extends HandleStorageService{ isLoggedIn: boolean = false; constructor(private events: Events){ //Below I am assuming you store the 'loggedIn' information in localStorage. You could use your own way for retrieving this value at the start of the app. this.isLoggedIn = JSON.parse(localStorage.getItem('loggedIn')); this.listenToLoginEvents(); } listenToLoginEvents(){ this.events.subscribe('user:login', () => { console.log("LoggedIn triggered"); this.loggedIn = true; }); this.events.subscribe('user:logout', () => { console.log("Logout triggered"); this.loggedIn = false; }); } }代码:(仅添加更改，但不添加整个代码）

user:login

现在说你有另一个组件来自你登录的位置。登录完成后你可以发布this.events.publish('user:login');这样的事件：

user:logout

同样适用于Stream.of("file1", "file2", "file3") // or your input in any other format, that can easily be transformed to a stream... // .parallel() // well... depends... .map(s -> CompletableFuture.supplyAsync(() -> download(s))) .map(dl -> dl.thenApply(Doc::getFilename)) .map(CompletableFuture::join) // if you want to have all the results collected .collect(Collectors.toList());。有关使用事件的详细信息，请参阅N2249。

app.component.ts的生命周期事件

1 个答案: