2016-10-28 33 views
0

因此,我想添加一個新頁面到我的離子應用程序..我已經通過命令行中的'離子生成頁面搜索頁面'創建了文件夾'searchpage'。然後我加入...離子2添加頁面,按鈕到搜索頁面什麼也不做

import { Searchpage } from '../searchpage/searchpage';

爲 'home.ts' 的頂部,並以此爲@Component下...

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

 

 

 
    constructor(public navCtrl: NavController, public authData: AuthData) { 
 

 
    } 
 

 
    logMeOut() { 
 
    this.authData.logoutUser().then(() => { 
 
     this.navCtrl.setRoot(LoginPage); 
 
    }); 
 
    } 
 

 
    searchPage(){ 
 
    this.nav.push(Searchpage); 
 
    } 
 

 
}

和然後在home.html我添加按鈕...

<button ion-button color="positive" block (click)="searchPage()"> 
 
    Search Page 
 
    </button>

該按鈕出現,但不會對點擊執行任何操作。

請幫我做錯了什麼?

+0

在你的構造你被點名了''NavController的實例作爲'navCtrl'但在'searchPage()'方法你做'this.nav ...'。改變'this.navCtrl.push(Searchpage);'的那一行 – sebaferreras

回答

0

您還需要在app.module.ts文件中導入新頁面。 然後將其添加到declarationsentryComponents陣列。看下面的例子:

import { NgModule } from '@angular/core'; 
import { IonicApp, IonicModule } from 'ionic-angular'; 

import { 
    Devices, 
} from '../providers'; 

import { MyApp } from './app.component'; 
import { Login } from '../pages/login/login'; 
import { Page1 } from '../pages/page1/page1'; 
import { Page2 } from '../pages/page2/page2'; 

@NgModule({ 
    declarations: [ 
    MyApp, 
    Login, 
    Page1, 
    Page2, 
    ], 
    imports: [ 
    IonicModule.forRoot(MyApp), 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    Login, 
    Page1, 
    Page2 
    ], 
    providers: [ 
    Devices, 
    ] 
}) 
export class AppModule { }