Changing variables inside platform.ready?

Hey guys, I have this simple page (Beta 4):

constructor(platform) {
  this.title = 'INITIAL';
  platform.ready().then(() => {
    this.title = 'INSIDE PLATFORM;

and in the HTML:


When I run this, title stays as INITIAL and never changes to INSIDE PLATFORM… unless I do something else outside platform.ready that triggers changes (like tapping a button or something).

Is this something of Angular 2 that I’m not understanding?

If I import ChangeDetectorRef from angular2/core and do cdr.detectChanges() inside platform.ready() then it works, but this feels weird.

It seems that maybe there’s a problem with platform.ready() in beta.4, see this thread for details:

any way to setup a JS plunker for me to try something out?

@nanexcool Sorry, but I’m not sure how to configure a plunker which uses ES6 syntax. For TS I used a configured plunker template which is available when creating a new Ionic issue but I don’t find a JS version there. Check if you can find a preconfigure ES6 plunker in Google.

@nanexcool You have to use NgZone to solve this in Ionic 2.

import {Page, Platform} from 'ionic-angular';
import {NgZone} from 'angular2/core';

  templateUrl: 'build/pages/page1/page1.html'
export class Page1 {
  static get parameters() {
    return [[Platform], [NgZone]];

  constructor(platform, zone) {
    this.title = "INITIAL";
    platform.ready().then(() => { => {
        this.title = "INSIDE PLATFORM";

But I find it really weird that with Typescript there’s no need for using NgZone. Why is it only required using Javascript?