Angular 2のイベントハンドラでhtml要素のプロパティ/属性を渡すにはどうすればよいですか？

Question

私はこのようにhtmlテンプレートに表示するデータのリストを持っています。

<div> 
    <a (click)='onClick(this)' someproperty='test'></a> 
    <a (click)='onClick(this)' someproperty='test'></a> 
    <a (click)='onClick(this)' someproperty='test'></a> 
    <a (click)='onClick(this)' someproperty='test'></a> 
</div> 

アイテムをクリックするたびに動的に1つのプロパティを変更したいと考えています。ただし、Angularはオブジェクトを未定義として表示しています。ここでは、このことができますPlunker!!

希望がある

declare var $:any; 
export class MyComponent { 
    onClick(someobject): void { 
    $(someobject).attr('someproperty','dontTest');//console shows "Undefined" 

    } 
} 

Answer 1

は以下しようと、

<a (click)='onClick($event)' someproperty='test'>click me</a> 

onClick(someobject): void { 
    someobject.target.attributes['someproperty'].value = "donttest"; 
    console.log(someobject.target.attributes['someproperty'].value); 
    } 

!!：

は、ここで私のコンポーネントでありますあなたは、テンプレート

でそれをすべて行うことができます

Answer 2

はAttribute Bindingマニュアルを参照してください。

ここ

<div> 
    <a (click)="val1 = 'new val 1'" [attr.someproperty]="val1">Link 1</a> 
    <a (click)="val2 = 'new val 2'" [attr.someproperty]="val2">Link 2</a> 
    <a (click)="val3 = 'new val 3'" [attr.someproperty]="val3">Link 3</a> 
</div> 

plunker

ちょうどリンクを検査し、someproperty変化を見るためにそれをクリックしてください。