Angular 2重新加載routerLink用戶再次點擊

我一直在尋找解決方案，但仍然沒有解決這個問題。當用戶點擊<a>時，他必須指向組件WrapPost並且WrapPost向他顯示一些信息。但是當用戶第二次點擊<a>則沒有任何事情發生。如何激活多點擊routerLink和WrapPost會每次更新？Angular 2重新加載routerLink用戶再次點擊

元器件搜索

<div class="formShell"> 
    <a class="aSearch" [routerLink]="['/search']" 
     [queryParams]="{category: selectedCategory, search: searchForm.value}"> 
    <input class="searchForm" placeholder="..." #searchForm> 
</div>

路線

const appRoutes: Routes = [ 
    { path: '', component: Home }, 
    { path: 'search', component: WrapPost}, 
    { path: 'login', component: Login }, 
    { path: '**', component: Error } 
];

來源

2017-02-12 Lestoroer

的[角2 - 刷新組件時routerLink再次點擊]可能的複製（http://stackoverflow.com/questions/37645368/angular-2-reload-component-when-routerlink-clicked-again） –

你的意思是你想你點擊鏈接，每次刷新數據。

實際上，您可以通過在服務中解耦數據檢索並創建一個在點擊鏈接時應該調用的函數（使用服務來檢索數據）來實現。事情是這樣的：

<a role="button" (click)="reloadData()"></a>

或者你可以創建一個重定向組件，它的作用只是用來重定向到搜索路徑。像這樣的東西。

import {Component, OnInit} from "@angular/core"; 
import {Router} from "@angular/router"; 

@Component({ 
    selector: 'redirect', 
    template: '' 
}) 
export class RedirectComponent implements OnInit { 

    constructor(private router: Router) { 
    } 

    ngOnInit() { 
     this.router.navigate(['/search']); 
    } 

}

，並添加路徑

const appRoutes: Routes = [ 
    // other routes 
    { path: 'redirect', component: RedirectComponent}, 
];

和鏈接會是這樣<a routerLink="/redirect"></a>

第一個建議是比第二個解決方法的解決方案要好得多。

來源

2017-02-12 10:58:24 MChaker

謝謝我解決這個問題。 – Lestoroer

我解決了我的問題rederict組件Error有path '**'並返回到組件WrapPost與setTimeout。

看看這個skipLocationChange它不保存歷史記錄（真正必要的參數）。

感謝這個帖子Angular 2 - Reload component when routerLink clicked again尤其jigar gala

HTML

<a class="aSearch" (click)="changeRoute('/search', searchForm.value)"></a>

元器件搜索

changeRoute(routeValue, searchForm) { 
    this.router.navigate(['**'], {skipLocationChange: true}); 
    setTimeout(function(){ 
     this.router.navigate([routeValue], 
      {queryParams: {category: this.selectedCategory, search: searchForm}} 
     ); 
    }.bind(this)); 

}

來源

2017-02-12 11:47:44 Lestoroer

我很抱歉，但我不會說英語。

所以我只會說代碼。

reload(link:string){ 
    this._router.navigate(['/'], {skipLocationChange: true}) 
     .then(() => { this._router.navigate([link]); }); 
}

來源

2017-07-18 12:03:27

Angular 2重新加載routerLink用戶再次點擊

回答

相關問題