How to use the ionic-angular.IonicPage function in ionic-angular

// Copyright The Linux Foundation and each contributor to CommunityBridge.
// SPDX-License-Identifier: MIT

import { Component } from '@angular/core';
import { IonicPage } from 'ionic-angular';
import { AuthService } from '../../services/auth.service';

@IonicPage({
  name: 'LogoutPage',
  segment: 'logout'
})
@Component({
  selector: 'logout-page',
  templateUrl: 'logout-page.html'
})
export class LogoutPage {
  constructor(
    public authService: AuthService
  ) { }

  ngOnInit() {
    // Will redirect user back to the login page after logging out of auth0
    this.authService.logout();
  }

// Copyright The Linux Foundation and each contributor to CommunityBridge.
// SPDX-License-Identifier: MIT

import { Component } from '@angular/core';
import { IonicPage } from 'ionic-angular';
import { AuthService } from '../../services/auth.service';

@IonicPage({
  name: 'LoginPage',
  segment: 'login'
})
@Component({
  selector: 'login-page',
  templateUrl: 'login-page.html'
})
export class LoginPage {
  constructor(
    private authService: AuthService
  ) { }

  login() {
    this.authService.login();
  }
}

// Copyright The Linux Foundation and each contributor to CommunityBridge.
// SPDX-License-Identifier: MIT

import { Component, ChangeDetectorRef, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { NavController, NavParams, ViewController, AlertController, IonicPage, Content } from 'ionic-angular';
import { EmailValidator } from  '../../validators/email';
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/forkJoin';
import { CincoService } from '../../services/cinco.service';

@IonicPage({
  segment: 'console-user-update-modal'
})
@Component({
  selector: 'console-user-update-modal',
  templateUrl: 'console-user-update-modal.html',
})
export class ConsoleUserUpdateModal {
  user: any;
  userRoles: any;
  keysGetter;
  form: FormGroup;
  submitAttempt: boolean = false;
  currentlySubmitting: boolean = false;
  @ViewChild(Content) content: Content;

  constructor(

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, ToastController } from 'ionic-angular';
import * as WC from 'woocommerce-api';
import { WoocommerceProvider } from '../../providers/woocommerce/woocommerce';

@IonicPage({})
@Component({
  selector: 'page-search',
  templateUrl: 'search.html',
})
export class SearchPage {

  searchQuery: string = "";
  WooCommerce: any;
  products: any[] = [];
  page: number = 2;

  constructor(public navCtrl: NavController, public navParams: NavParams, public toastCtrl: ToastController, private WP: WoocommerceProvider) {
    console.log(this.navParams.get("searchQuery"));
    this.searchQuery = this.navParams.get("searchQuery");

    this.WooCommerce = WP.init();

import {Component} from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {IonicPage, NavController, NavParams} from 'ionic-angular';

/**
 * Generated class for the InformationDetailPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-information-detail',
  templateUrl: 'information-detail.html',
})
export class InformationDetailPage {
  main: any;

  constructor(public navCtrl: NavController, public navParams: NavParams, public http: HttpClient) {
    let informationDetailUrl = "http://m.maoyan.com/information/" + this.navParams.get('contentId');
    console.log(informationDetailUrl);
    this.http.get(informationDetailUrl, {responseType: 'text'}).subscribe(data => {
      this.getMain(data);
      document.getElementById("information-detail-content").getElementsByClassName("scroll-content")[0].appendChild(this.main);
    });
  }

import { TabsPage } from "../tabs/tabs";
import { SignupPage } from "../signup/signup";
import { LoginService } from "../../services/login-service/login.component.service";
import { AlertController, LoadingController } from "ionic-angular";
import {Provider} from '../../provider/provider'
import * as jwtDecode from 'jwt-decode';
import { StatusBar } from '@ionic-native/status-bar';

/**
 * Generated class for the LoginPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: "page-login",
  templateUrl: "login.html"
})
export class LoginPage {
  username: String;
  password: String;
  constructor(
    public navCtrl: NavController,
    public navParams: NavParams,
    public loginService: LoginService,
    private alertCtrl: AlertController,
    public loadingCtrl: LoadingController,
    public provider:Provider,
    public statusBar: StatusBar
  ) {}

import { Component } from '@angular/core';
import { NavController, IonicPage } from 'ionic-angular';

@IonicPage()
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  selectedAnimation: any = "interactive";
  animations: any;
  interactive = false;
  anim: any;
  animationSpeed: number = 1;

  interactiveAnimationOption = {
    loop: true,
    prerender: false,
    autoplay: false,

import { Component } from '@angular/core';
import { NavController, IonicPage } from 'ionic-angular';
import { SpotifyProvider } from '../../providers/spotify/spotify'
import { FormBuilder, Validators, FormGroup } from '@angular/forms';
@IonicPage()
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  public tracks;
  public searchForm: FormGroup

  constructor(
    public navCtrl: NavController,
    public fb: FormBuilder,
    public spotify: SpotifyProvider
  ) {
      this.searchForm = this.fb.group({
        'term': ['', Validators.required]
      })

import {Component} from '@angular/core';
import {
    IonicPage, NavController, NavParams, ActionSheetController, App, ModalController,
    ViewController,
    Events,
} from 'ionic-angular';
import {Storage} from '@ionic/storage';
import {UserProvider} from "./../../providers/user/user";
import {ToastProvider} from "../../providers/toast/toast";

@IonicPage({
    name: "account"
})
@Component({
    selector: 'page-account',
    templateUrl: 'account.html',
})
export class AccountPage {
    public user: any = {
        wechat: null,
        qq: null,
        weibo: null
    };

    constructor(public navCtrl: NavController,
                public navParams: NavParams,
                public modalCtrl: ModalController,

import { UtilProvider } from 'providers/util/util';
import { Component } from '@angular/core';
import { IonicPage, ToastController, NavParams, AlertController, MenuController, Platform } from 'ionic-angular';
import { SettingsProvider } from 'providers/settings/settings';
import { StatusBar } from '@ionic-native/status-bar';
import { Storage } from '@ionic/storage';
import { TranslateService } from '@ngx-translate/core';
import { SharedServiceProvider } from 'providers/shared-service/shared-service';

@IonicPage()
@Component({
  selector: 'page-settings',
  templateUrl: 'settings.html',
})
export class SettingsPage {
  public upvote = 1;
  public language = 'en';
  public claim: boolean = false;
  private currency = 'USD';
  selected: String;
  availableThemes: { className: string, prettyName: string }[];

  constructor(public toastCtrl: ToastController,
    public alertCtrl: AlertController,
    private sharedService: SharedServiceProvider,
    private platform: Platform,