創建三個文件
html、ts、module.ts
html:對應內容爲要跳轉的頁面的內容
ts:將@IonicPage
裝飾器添加到組件
module.ts:在IonicPageModule.forChild
導入頁面模塊時添加深層鏈接的頁面
示例:
html:adv_plugin.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>
<a href="javasrcipt:void(0);" onclick="top.location.href = '/#/adv-content';">
<img src="http://img.zcool.cn/community/0117e2571b8b246ac72538120dd8a4.jpg@1280w_1l_2o_100sh.jpg"/>
</a>
</div>
</body>
</html>
ts:adv_plugin.ts
import {IonicPage} from "ionic-angular";
import {Component} from "@angular/core";
@IonicPage({ //設置路由名稱例:localhost:8100/#/adv-plugin 跳轉 (注意需要加"/#/")
name: 'adv-plugin',
segment: 'adv-plugin'
})
@Component({
templateUrl: 'adv_plugin.html' //對應頁面
})
export class AdvPlugin {
}
module.ts:adv_plugin.module.ts
import {AdvPlugin} from "./adv_plugin";
import {IonicPageModule} from "ionic-angular";
import {NgModule} from "@angular/core";
@NgModule({ //把下面三個AdvPlugin改成ts中的class
declarations: [
AdvPlugin //對應ts中的名稱
],
imports: [
IonicPageModule.forChild(AdvPlugin)
],
entryComponents: [
AdvPlugin
]
})
export class AdvPlugineModule {
}
三個文件寫完。。就可以愉快的鏈接了
localhost:8100/#/adv-plugin (注意需要加"/#/")
最後發一下官方教程:
https://ionicframework.com/docs/api/navigation/IonicPage/