首页 > 解决方案 > 数据动态传递到组件路由时处理页面刷新?

问题描述

当组件中使用的数据仅在路由到时提供时,如何处理页面刷新?

在下面的代码片段中,您可以看到我通过路由器的状态对象为公司对象提供了表中每一行的路由。

公司设置组件类html

<!-- Name Column -->
        <ng-container matColumnDef="name">
        <mat-header-cell *matHeaderCellDef mat-sort-header>Company</mat-header-cell>
        <mat-cell *matCellDef="let company">
            <div fxLayout="column">
                <span>{{ company.EoName }}</span>
                <a routerLink='/company-details' [state]=company><span class="mat-small">Go to details page.</span></a>
            </div>
        </mat-cell>
        </ng-container>

然后在路由到的组件类中,我正在访问这样的状态对象:

公司详细信息组件 .ts

company: ICompany;

constructor(private _router: Router) {
    this.company = this._router.getCurrentNavigation().extras.state
}

访问组件模板的唯一方法是单击该公司表中的链接,这就是提供数据的方式。

这适用于我的用例,但如果用户决定刷新页面,我需要一种方法来重新提供或保留相同的公司对象。

我正在寻找一种方法来解决这个问题或使用不同的方式为组件路由提供动态数据。

在此处输入图像描述

标签: angulartypescriptdynamicangular-materialrouter

解决方案


推荐阅读