Angular2 - 如何访问存储在数据属性中的值

Question

可能有人问过这个问题，但我尝试用谷歌搜索一段时间，但没有得到任何解决方案。

我在 Angular2 中有以下选择字段，如何访问attr.data-thisdata的数据属性中存储的值？

<select #dial">
   <option *ngFor="let something of somethings"
     [value]="something.value" 
     [attr.data-thisdata]="something.data"
   >{{something.text}}</option>
</select>

我尝试了以下方法，但没有得到任何值:

1. <select (change)="readData($event.target.dataset)>...<select>
2. <select (change)="readData($event.target.dataset.thisdata)>...<select>

我的读取数据很简单:

readData(data:any){
    console.log(data)
}

编辑 1:添加 plunker方便引用

编辑 2:包含 plunker from Günter's answer

Answer 1

要回答如何通过 select 元素的事件访问 option 元素的数据属性的原始问题，请使用:

event.target[event.target.selectedIndex].dataset.thisdata

event.target.dataset.thisdata 不起作用的原因是 data 属性实际上属于 option，但这里的事件来自 select 元素。我们可以使用选择的 selectedIndex 属性来访问所选选项。