Just My Life & My Work

[Ionic] 視圖生命週期 (Ionic View Life Cycle)

2016 年 10 月 29 日

在寫iOS Native App時早已知道視圖生命週期 (View Life Cycle)非常重要，因為它會決定我們接下來時做的流程。現在使用Ionic同樣也有視圖生命週期 (Ionic View Life Cycle)，現在就稍微來瞭解其前後關係吧！

Ionic View Life Cycle.jpg

實作的部分跟iOS同樣是寫在Controller中。

$scope.$on('$ionicView.loaded', function(){
  // Anything you can think of
});
$scope.$on('$ionicView.enter', function(){
  // Anything you can think of
});
$scope.$on('$ionicView.leave', function(){
  // Anything you can think of
});
$scope.$on('$ionicView.beforeEnter', function(){
  // Anything you can think of
});
$scope.$on('$ionicView.afterEnter', function(){
  // Anything you can think of
});
$scope.$on('$ionicView.beforeLeave', function(){
  // Anything you can think of
});
$scope.$on('$ionicView.afterLeave', function(){
  // Anything you can think of
});
$scope.$on('$ionicView.unloaded', function(){
  // Anything you can think of
});

FIRST TIME VIEW INITIALIZATION

  1. View 1 – loaded
  2. View 1 – beforeEnter
  3. View 1 – enter
  4. View 1 – afterEnter

TRANSITION FROM ONE VIEW TO ANOTHER

  1. View 2 – loaded
  2. View 2 – beforeEnter
  3. View 1 – beforeLeave
  4. View 2 – enter
  5. View 1 – leave
  6. View 2 – afterEnter
  7. View 1 – afterLeave

名稱不太一樣，然而原理差不多，所以只要多寫幾次，就熟能生巧。

參考：Ionic View Life Cycle。

分類：

Ionic, 教學

發表留言

Tagged with:

隨意留個言吧：）～

在下方填入你的資料或按右方圖示以社群網站登入：

Gravatar
WordPress.com 標誌

您的留言將使用 WordPress.com 帳號。 ( 登出 /  變更 )

Twitter picture

您的留言將使用 Twitter 帳號。 ( 登出 /  變更 )

Facebook照片

您的留言將使用 Facebook 帳號。 ( 登出 /  變更 )

取消

連結到 %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

標籤雲

%d 位部落客按了讚：