如何刷新Angular 2中的页面 [英] how to refresh page in angular 2

查看:156
本文介绍了如何刷新Angular 2中的页面的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我创建了一个路由器链接,如下所示.此路由器链接加载ProductsStartComponent,然后此组件使用ngif而不是通过导航加载其他几个组件.由于产品类别"下面的链接"在所有页面中都可见,因此,如果我在到达ngif的某些组件后单击此链接,则不会把我带回ProductsStartComponent.

I have created one router link as below. This router link loads ProductsStartComponent and then this component loads several other components using ngif and not via navigation. Since below Product categories link is visible in all pages so if I am clicking on this link after reaching to some component of ngif , this is not taking me back on ProductsStartComponent.

由于我是Angular的新手,所以我对这种行为的理解是因为所有值/模型都已设置,这就是为什么它不导航的原因.我想可以通过刷新或重新加载页面来实现,但是如何实现.请告知.

As I am new to Angular , my understanding for this behavior is because all values/models are set and that's why it's not navigating. I suppose this can be achieved by refresh or reload of page but how to achieve that. Please advise.

在admin.component.html中,定义了路由器链接以供单击.
返回

In admin.component.html, router Link is defined for clicking.
returns

<li routerLinkActive="active"><a routerLink="categories"><p>Products Categories</p></a></li>

返回

在app-routing.module.ts中,单击路由器链接时需要加载哪个组件

In app-routing.module.ts, which component need to be loaded on clicking of router link

const appRoutes: Routes = [
{path: 'admin', component: AdminComponent, children: [
    { path: 'dashboard', component: AdminDashboardComponent },
    { path: 'sellers', component: AdminSellersComponent },
    { path: 'categories', component: ProductsStartComponent}
]}]

在product-start.component.html中,第一次单击路由器链接即会加载该文件.现在,如果我单击编辑"按钮并移至其他组件,然后再次单击产品类别路由器"链接,则什么也没有发生,我希望它可以重置页面.

In product-start.component.html, this is being loaded on first click on router link. Now if I click on edit button and moved to other component and again if i click on product categories router link , nothing happen , I am expecting it to reset the page.

<div>
    <div *ngIf="!isChildProductClicked; else notClicked" >
       <app-admin-products (productId)="received($event)"></app-admin-products>
    </div>
    <ng-template #notClicked><app-child-products [selProdIndex]=productIndex></app-child-products></ng-template>
</div>

推荐答案

如果要重新加载页面,可以轻松转到组件,然后执行:

If you want to reload the page , you can easily go to your component then do :

location.reload();

这篇关于如何刷新Angular 2中的页面的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆