Question

我刚刚从离子4 beta 17更新为18，并引入了<ion-item>和<ion-button>的重大变化。 href 被替换为 routerLink 。

我将此添加到了代码中，现在路由不再起作用。多数情况下，编译器会抛出错误并说，ionitem中不存在routerLink。

我做错了什么？还是有角度？

"@ionic/angular": "~4.0.0-beta.18",
"@ionic/core": "~4.0.0-beta.18",
"@angular/core": "^7.1.3",
"@angular/router": "~7.1.3",

<ion-item text-wrap class="nav-item" routerDirection="forward" 
        [routerLink]="p.url"
        *ngFor="let p of listOfPages; let i = index"
        [class.active-item]="checkActivePath(p.url)"
        [class.last-item]="i === (listOfPages.length - 1)">
    <ion-label class="nav-label">
        <ion-img [src]="p.icon" class="nav-icon"></ion-img>
        <div class="text-block">
            {{ p.title }}
        </div>
    </ion-label>
</ion-item>

Answer 1

在routerDirection之后是否可能缺少“”？

routerDirection="forward

编辑：使用离子组件时，应使用href。 RouterLink用于非离子组件。

Answer 2

将RouterModule导入模板所在模块（使用routerLink的模块）的模块文件中：

import { RouterModule } from '@angular/router';
@NgModule({
    imports: [
        // ...
        RouterModule,
    ]

Answer 3

所以这终于对我有用：

确保在每个模块中都包含 RouterModule 。

在我使用的每个嵌套模块中

const routes: Routes = [{
    path: '',
    component: AboutUsPage
}];

我也在那里导入了RouterModule.forChild(routes)。
对于路由，我在路径之前添加了/。像'/home'
在 app-routing.ts 中，我使用了{path: 'about-us/:id', component: AboutUsPage},。

Ionic 4 Beta 18-带有routerLink的离子项目和离子按钮不会更改路线

3 个答案: