所有我都是关于ionic2和angular2的新手我想问这个方法是否真实?我有一个数组,其中包含一些带有页面属性示例的菜单
{
"menu" : [
{"nama" : "My Repair Request","page":"RepairRequestPage","icon":"ios-hammer-outline"},
{"nama" : "My Front Desk Instruction","page":"FrontDeskinstPage","icon":"ios-desktop-outline"},
{"nama" : "Amenity Reservation","page":"","icon":"ios-clipboard-outline"},
{"nama" : "My Delivery","page":"","icon":"ios-cube-outline"}
]
}
然后我循环查看并给出一些功能:
<div>
<ion-card class="menuCard center_content" *ngFor="let item of list_menu" (click) = 'openMenu(item)'>
<ion-icon ios="{{item.icon}}" md="{{item.icon}}" ></ion-icon>
<span>
{{item.nama}}
</span>
</ion-card>
</div>
功能是:
openMenu (param : any) {
this.navCtrl.push(param.page);
}
首先我注意到,当页面被推送时,有一些链接写在URL栏http://localhost:8100/#/home/repair-request上
我想问一下是不是在角度2路线没有像这样运行我有点好奇这可以有人向我解释它是否是正确的...
[]
您必须创建一个RouterModule实例,它将执行我们所需的路由功能。
之后,您只需将路径对象数组传递给RouterModule上的forRoot
或forChild
方法。
此外,请确保您正在对useHash
的RouterModule选项执行false
。
{useHash:false}
useHash:
启用使用URL片段而不是历史API的位置策略。
检查app.routes.ts
中的以下示例代码
import { ModuleWithProviders } from '@angular/core';
import { RouterModule } from '@angular/router';
// custom imports
import { Page1Component } from '../pages/page1/page1.component';
import { Page2Component } from '../pages/page2/page2.component';
import { Page3Component } from '../pages/page3/page3.component';
export const APP_ROUTES_PROVIDER: ModuleWithProviders = RouterModule.forRoot(
[
{ path: '', redirectTo: '/page1', pathMatch: 'full' },
{ path: 'page1', component: Page1Component },
{ path: 'page2', component: Page2Component },
{ path: 'page3', component: Page3Component}
] , {useHash: false});
对于每条路线,我们提供一个path
和component
,应该在该路径上呈现。 HomeComponent路径的空字符串表示在没有URL时将呈现HomeComponent。
然后,您只需将我们的新路由模块导入应用程序模块即可。
imports: [
APP_ROUTES_PROVIDER,
IonicModule.forRoot(MyApp)
],
希望这会对你有所帮助!!