New to Ionic: Typescript Error in App.Component.Ts

Question

I am getting a TypeScript Error in my Ionic app. I have a sidemenu app, and was separating the menu into it's own component so that I could add a login page more easily. I have been following this guide to do so: http://roblouie.com/article/344/ionic-2-hide-menu-or-tabs-for-login-screen/

In my new app.component.ts I have the following code:

import { Component, ViewChild } from '@angular/core';
import { Nav, Platform } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { MenuComponent } from "./menu.component";

@Component({
  template: '<ion-nav #baseNav></ion-nav>'
})
export class MyApp {
  @ViewChild('baseNav') nav: Nav;

  constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen) {
    this.initializeApp();
  }

  ngOnInit() {
    this.nav.push(MenuComponent, { animate: false });
  }

  initializeApp() {
    this.platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      StatusBar.styleDefault();
      SplashScreen.hide();
    });
  }
}

I am fairly new with Ionic and I have been mostly following guides to get started. Any advice on the matter would be greatly appreciated. Here is the error message I am getting:

Error Message

sebaferreras · Accepted Answer · 2017-10-10 19:23:54Z

3

Use the instances that Angular injects in the constructor (DI) instead of the static methods of the StatusBar and the SplashScreen classes, as shown below:

initializeApp() {
    this.platform.ready().then(() => {
        this.statusBar.styleDefault();
        this.splashScreen.hide();
    });
}

edited Oct 10, 2017 at 19:23

sebaferreras

44.7k11 gold badges120 silver badges137 bronze badges

answered Oct 10, 2017 at 16:48

Sampath

66.2k70 gold badges326 silver badges461 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

New to Ionic: Typescript Error in App.Component.Ts

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related