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

Question

我刚刚从 ionic 4 beta 17 更新到 18，并引入了 <ion-item> 和 <ion-button> 中的重大更改。 href 已替换为 routerLink。

我将其添加到我的代码中，但现在路由不再起作用。大多数情况下，编译器会抛出错误并提示 ion-item 中不存在 routerLink。

我做错了什么？还是 angular?

"@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

编辑：当您使用 Ionic 组件时，您应该使用 href。 RouterLink 用于非 Ionic 组件。

Answer 2

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

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 的离子项目和离子按钮不会改变路线

Ionic 4 beta 18 - ion-item and ion-button with routerLink don't change route

beta

ionic-framework

angular

ionic4

angular7