在angular2中附加單擊以錨定標記

我試圖將單擊事件附加到錨定標記（來自ajax）並阻止默認重定向。我怎樣才能做到角2？在angular2中附加單擊以錨定標記

<ul> 
<li><a href="/abc"><p>abc</p></a></li> 
<li><a href="/abc1"><p>abc1</p></a></li> 
<li><a href="/abc2"><p>abc2</p></a></li> 
<li><a href="/abc3"><p>abc3</p></a></li> 
</ul>

在TS文件

constructor(elementRef: ElementRef, renderer: Renderer) { 

     this.listenFunc = renderer.listen(elementRef.nativeElement, 'click', (event) => { 
      event.preventDefault(); 
      let target = event.target || event.srcElement || event.currentTarget; 
      console.log(target); 

     }); 


    }

這將附上事件的所有元素，如何限制這個錨標籤只

一切都有助於理解

來源

2017-01-04 shahul

你可以使用'event.target.nodeName'來知道點擊哪個HTML標籤。 – ranakrunal9

'（點擊）='fn''可以使用。 – Jai

@jai謝謝我不能操縱ajax響應我必須處理它從ts文件 – shahul

我想你不讓Angular爲你工作。

在角2：

從<a>卸下href標籤，以防止一個頁面轉發。
然後只需添加您通常的Angular click屬性和函數。
添加到style: "cursor: pointer"使它像一個按鈕

來源

2017-05-30 12:51:54 PatrickW

但是，這並不會使它呈現像鏈接。它看起來像正常的段落文本。 – Neutrino

你可以用CSS控制外觀。你想讓你的鏈接看起來像什麼？ – PatrickW

一個鏈接，我寧願不必爲了使鏈接看起來像鏈接而亂搞手動樣式，因爲它應該做任何事情。 – Neutrino

<a href="#" (click)="onGoToPage2()">Go to page 2</a>

來源

2017-10-17 15:23:24 Neutrino

這在Angular 4中適用於我。 – skiabox

但＃重載頁面，有什麼辦法只適用於href標籤上的點擊事件 –

您可以使用routerLink這是href對角2的替代品。**在HTML如下使用routerLink

<a routerLink="/dashboard">My Link</a>

並確保您註冊您的routerLink在modules.ts或router.ts像這樣

const routes: Routes = [ 
    { path: 'dashboard', component: DashboardComponent } 
]

來源

2017-11-13 04:40:16

我能實現這個成功

<a [routerLink]="['/login']">abc</a>

來源

2017-11-13 06:25:26

您可以使用routerLink（這是href的角度2+替代）與下面單擊事件從一個頁面，以防止重裝

<a [routerLink]="" (click)="onGoToPage2()">Go to page 2</a>

來源

2018-01-11 05:43:38 Vicky

這個答案應該被接受... – miderose

[routerLink]是爲內部URL。如果我們想要將用戶發送到外部網址並同時觀看點擊事件，該怎麼辦？ –

<a href="javascript:void(0);" (click)="onGoToPage2()">Go to Page 2</a>

來源

2018-01-13 10:58:54 zerg

這個問題一年前問過。原始海報不太可能存在同樣的問題，因此新的答案應盡力提供儘可能多的細節，以顯示答案如何幫助其他具有相同問題的人。這個答案更像是一個評論，而不是一個完整的，研究的，解釋的答案。 – Claies

在angular2中附加單擊以錨定標記

回答

相關問題