ОШИБКА Ошибка: Uncaught (в обещании): недопустимые представления для вставки при установке Root в menupage при нажатии кнопки входа - PullRequest
Новая
       26

ОШИБКА Ошибка: Uncaught (в обещании): недопустимые представления для вставки при установке Root в menupage при нажатии кнопки входа

0 голосов
/ 30 ноября 2018

После успешного входа в систему, когда я устанавливаю root на страницу меню. Я получаю следующую ошибку. Ошибка: Uncaught (в обещании): неверные представления для вставки .Мне нужно иметь отдельные элементы меню, основанные на значении входа в систему. Так что я держу код меню в одном отдельном html, который является menu.html.

Я добавил сюда menu.html, menu.ts и login.ts.Я сохранил свой код меню в menu.html 

<ion-menu [content]="content" side="right">
  <ion-header>
    <ion-toolbar>
      <ion-title>Menu</ion-title>
    </ion-toolbar>
  </ion-header>

  <ion-content>
    <ion-list>
      <button ion-item detail-none block menuClose *ngFor="let p of pages" (click)="openPage(p)">
        <ion-icon item-start [name]="p.icon"></ion-icon>
        {{ p.title }}
      </button>
    </ion-list>

  </ion-content>

  <ion-footer>
    <ion-toolbar>
      <ion-row align-items-center>
        <ion-col>
          {{ username }}
        </ion-col>
        <ion-col>
          <button ion-button full clear icon-left (click)="logout()">
            <ion-icon name="sign-out">
            </ion-icon>
            Logout</button>
        </ion-col>
      </ion-row>
    </ion-toolbar>
  </ion-footer>

</ion-menu>

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

И в моем файле menu.ts указан код ниже. 

import { Component, ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams, Nav, App } from 'ionic-angular';
import { FirstPage } from '../first/first';
import { SecondPage } from '../second/second';
import { AuthProvider } from './../../providers/auth/auth';
import { LoginPage } from '../login/login';


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

  rootPage: any;
  pages = [];
  username = '';

  // Reference to the side menus root nav
  @ViewChild(Nav) nav: Nav;

  constructor(public navCtrl: NavController, private authProvider: AuthProvider, private appCtrl: App) {
  }

  ionViewWillEnter() {
    if (this.authProvider.isAdmin()) {
      this.pages = [
        { title: 'FirstPage', component: FirstPage, icon: 'home' },

      ];
      this.openPage(FirstPage);
    } else {
      this.pages = [
        { title: 'FirstPage', component: FirstPage, icon: 'home' },
        { title: 'SecondPage', component: SecondPage, icon: 'home' }

      ];
      this.openPage(FirstPage);
    }
    this.username = this.authProvider.currentUser.name;
  }

  logout() {
    this.authProvider.logout();
    this.appCtrl.getRootNav().setRoot(LoginPage);
  }

  openPage(page) {
    this.nav.setRoot(page.component);
  }

  ionViewCanEnter() {
    return this.authProvider.isLoggedIn();
  }
}

А в моем файле login.ts указан код ниже. 

import { AuthProvider } from './../../providers/auth/auth';
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, AlertController } from 'ionic-angular';
import { MenuPage } from '../menu/menu';

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

  user = {
    name: 'admin',
    pw: 'admin'
  };

  constructor(public navCtrl: NavController, private authProvider: AuthProvider, private alertCtrl: AlertController) { }

  loginUser() {
    this.authProvider.login(this.user.name, this.user.pw).then(success => {
      if (success) {
        this.navCtrl.setRoot(MenuPage);
      } else {
        let alert = this.alertCtrl.create({
          title: 'Login failed',
          message: 'Please check your credentials',
          buttons: ['OK']
        });
        alert.present();
      }
    });
  }
}

Может кто-нибудь, пожалуйста, помогите мне, где я делаю неправильно.

...