Question

所有我都是关于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路线上没有像这样运行我有点好奇这可以有人向我解释它是否是正确的...

[ enter image description here ]

Answer 1

您必须创建将执行我们所需路由功能的RouterModule实例。

之后，您只需将一组路径对象传递给 RouterModule 上的forRoot或forChild方法。

另外，请确保您正在对useHash false的RouterModule选项进行操作。

{useHash：false}

useHash:启用使用网址片段而非历史记录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)
],

如需更多帮助，请查看link1和link2。

希望这会对你有所帮助!!

页面url在ionic2上推送页面时写入

1 个答案: