0
我遇到了一個問題，當我在使用主要app.html中的指令時，我的應用程序導航尚未定義，當我嘗試注入在我的指令的類內部的ionic-angular的NavController或NavParams服務我得到錯誤「沒有NavController的提供者」或「沒有NavParams的提供者」。IONIC 2 BETA/Angular 2 - 應用指令還沒有定義導航
我的猜測是在我的指令類被初始化後，Nav被設置。我試圖使用@ViewChild或app.getActiveNav（），但它們都返回NULL。
有人可以請向我解釋正確的方法來注入在應用程序指令導航？
app.ts：
import {Component, Inject, ViewChild} from '@angular/core';
import {NavController, Nav, Loading, Platform, ionicBootstrap, Modal} from 'ionic-angular';
import {StatusBar} from 'ionic-native';
import {LoginPage} from './pages/login/login';
import {HomePage} from './pages/home/home';
import {ContactTabPage} from './pages/contact/tabs/tab';
import {WorkspaceTabPage} from './pages/workspace/list/tabs/tab';
import {UserService} from './providers/user-service/user-service';
import {Http} from '@angular/http';
import {Global} from './global';
import {ChatContactsPage} from './pages/chat/contacts/chat-contacts';
import {PushdService} from './providers/pushd-service/pushd-service';
import {Events} from 'ionic-angular';
@Component({
templateUrl: 'build/app.html',
directives: [ChatContactsPage],
queries: {
nav: new ViewChild('content')
}
})
export class MyApp {
@ViewChild(Nav) nav: Nav;
currentUser: any;
rootPage: any = LoginPage;
contact: any = ContactTabPage;
home: any = HomePage;
workspace: any = WorkspaceTabPage;
userService: any;
pushdService: any;
global: any;
constructor(platform: Platform, http:Http, events:Events) {
this.global = Global;
this.userService = new UserService(http);
let callback = (data) => {
this.rootPage = HomePage;
this.global.currentUser = data;
this.pushdService = new PushdService(http, events);
};
this.userService.verifyLoginUser(callback);
platform.ready().then(() => {
StatusBar.styleDefault();
});
}
openPage(page) {
this.rootPage = page;
}
logout(){
let loading = Loading.create({
content: 'Aguardando...'
});
this.nav.present(loading);
let callback = (data) => {
this.rootPage = LoginPage;
loading.dismiss();
}
this.userService.logout(callback);
}
}
ionicBootstrap(MyApp);
app.html
<ion-menu [content]="conteudo" side="left">
<ion-content>
<ion-list class="menu-init">
<ion-item primary class="back-user">
<div class="logo-user">
<img src="{{global.currentUser.image_profile_full_path}}">
<br>
<span>
<strong>{{global.currentUser.display_name}}</strong>
</span>
</div>
</ion-item>
<button ion-item (click)="openPage(home)" menuClose> <ion-icon name="home" start></ion-icon> Home</button>
<button ion-item (click)="openPage(contact)" menuClose> <ion-icon name="people" start></ion-icon> Contatos </button>
<button ion-item (click)="openPage(workspace)" menuClose> <ion-icon name="briefcase" start></ion-icon> Espaços de trabalho </button>
<button ion-item (click)="logout()" menuClose> <ion-icon name="exit" start></ion-icon> Sair </button>
</ion-list>
</ion-content>
</ion-menu>
<ion-menu [content]="conteudo" side="left">
<ion-content>
<ion-list class="menu-init">
<ion-item primary class="back-user">
<div class="logo-user">
<img src="{{global.currentUser.image_profile_full_path}}">
<br>
<span>
<strong>{{global.currentUser.display_name}}</strong>
</span>
</div>
</ion-item>
<button ion-item (click)="openPage(home)" menuClose> <ion-icon name="home" start></ion-icon> Home</button>
<button ion-item (click)="openPage(contact)" menuClose> <ion-icon name="people" start></ion-icon> Contatos </button>
<button ion-item (click)="openPage(workspace)" menuClose> <ion-icon name="briefcase" start></ion-icon> Espaços de trabalho </button>
<button ion-item (click)="logout()" menuClose> <ion-icon name="exit" start></ion-icon> Sair </button>
</ion-list>
</ion-content>
</ion-menu>
<ion-menu [content]="chat" side="right">
<ion-content>
<chat-contacts></chat-contacts>
</ion-content>
</ion-menu>
<ion-nav [root]="rootPage" #conteudo #chat></ion-nav>
聊天contact.ts
import {Component, ElementRef, ViewChild} from '@angular/core';
import {ChatService} from '../../../providers/chat-service/chat-service';
import {NavController, Nav, App, NavParams} from 'ionic-angular';
import {ChatRoomPage} from '../room/chat-room';
@Component({
selector: 'chat-contacts',
templateUrl: 'build/pages/chat/contacts/chat-contacts.html',
queries: {
nav: new ViewChild('content')
}
})
export class ChatContactsPage {
view: any;
user: any;
contactsList: any;
@ViewChild(Nav) nav: Nav;
constructor(private app: App) {
ChatService.callback = (data) => {
console.log('recebido', data);
this.contactsList = data;
};
ChatService.getContactsList();
}
close() {
this.view.dismiss();
}
goToPage (page, pageParams?:Object) {
if (page == 'chat-room') {
this.nav.push(ChatRoomPage);
}
}
}
聊天contact.html
<ion-list class="menu-init" *ngIf="contactsList && contactsList.users.length > 0">
<ion-item (click)="goToPage('chat-room', {co_user: contact.co_user})" primary class="back-user" *ngFor="let contact of contactsList.users">
<div style="position: relative;">
<span class="logo-user-sm">
<img src="{{contact.user_image_full_path}}">
</span>
<span style="vertical-align: middle;position: absolute;">
<strong>{{contact.no_user}}</strong>
</span>
</div>
</ion-item>
</ion-list>
IONIC版本：2.0.0-beta.37