2017-10-23 25 views
1

私はこのテーブルを持っており、その中にユーザがそれをクリックして別のページにナビゲートするタグを持っています。現在のところ、私はそれがうまく動作しますが、私は私のキーボードを使用しているときに私はどこにも私を取らないリンクを入力してくださいと私はそれをボタンに変換する必要があります。​​はタブでリンクすることができます

これは私が持っているものです。

<td role="gridcell"> 
    <a (click)="userClicked(user)">{{user.Name}}</> 
</td> 

私はスパンの代わりに、タグが、それでも運を使用してみました。

<td role="gridcell"> 
     <span role="button" tabindex="0" (click)="userClicked(user)">{{user.Name}}</span> 
</td 

答えて

0

あなたはそれが正常に動作している、代わりに<button>要素を使用することができます(keyup.enter)

<a href="#" (keyup.enter)="userClicked(user)">{{user.Name}}</a> 
0

を試してみてください。

tabキーをクリックして<a>タグを選択するだけで問題はありましたが、これは問題がある可能性があります(私は既存のプロジェクトでこれを試しています)。

<td><button (click)="test()">TEST</button></td> 

EDIT

はあなたの問題は、あなたがあなたのアンカーにhref属性を持っていないということであり、それゆえフォーカス可能ではありません(@Richardメデイロスはコメントで、ここで述べたように)。私はちょうどそれをテストし、それはちょうど(click)バインディングで動作します。

あなたがhref属性に従わないので、ハンドラからfalseを返すことを忘れないでください:あなたは `に` href`を追加する場合https://angular-playground-1ji4ko.stackblitz.io

+2

:ここ

<td><a href="#" (click)="test()">TEST</a></td> test() { // ... return false; } 

は実施例であります'タグでタブできるようになります –

+0

ああありがとう!それを知らなかった... –

+0

私は単に聞いたことがあります - どのように/(なぜなら) '(クリック)部分は機能しますか?私はこれまでにそれを見たことがないし、それを自分でテストするとき、それは単に動作しません。何か不足していますか? –