Angular 角度2：检查单击元素时shift键是否已按下

在Angular 2应用程序中，当按住shift键时，我希望单击事件触发不同的事件。如何做到这一点

html格式如下：

<div class="item" *ngFor="#obj of available" (click)="toggleSelected(obj)"></div>

---

那么如何检测是否按下了shift键？谢谢

使用

按键

<div class="item" *ngFor="#obj of available" (keypress)="eventHandler($event)"></div>

eventHandler(event) {
   console.log(event, event.keyCode, event.keyIdentifier);
} 

事件处理程序（事件）{
日志（event，event.keyCode，event.keyIdentifier）；
} 

在

（单击）

绑定中，将

$event

对象传递给

toggleSelected

方法：

在

toggleSelected

方法中，检查事件的

shiftKey

属性是否为

true

：

toggleSelected（对象、事件）{
if（事件移位键）{
//这样做
}否则{
//那样做
}
}

您的问题可能涉及表格记录的多选选项

在这种情况下，可以将选定对象存储在一个集合中

public selectedRowSet: Set<MyObject> = new Set();    

然后您可能需要添加条件格式

public isRowSelected(obj: MyObject): boolean
{
  return selectedRowSet.has(obj);
}

在您看来，请使用：

<tr *ngFor="let obj of myObjectCollection" 
    [class.someCssClass]="isRowSelected(obj)" 
    (click)="setSelectedRow(obj, $event);">
...
</tr>

实际的答案是，该事件内置了此功能

<input (keydown)="onKey($event)"` ...

---

我应该在哪里捕获
$event
？它表示未定义。@dragon\u cat：确保将
$event
作为
（单击）
绑定中的第二个参数传递，并将
event
作为参数添加到
toggleSelected
。回答得好。为了完整起见：我添加了一个答案，其中也提到了参数的类型。如果您使用codecompletion（例如在visual studio代码中），这将非常有用。我在mac上对
命令
尝试了相同的方法，
const add=event.keyCode==91 | | event.shiftKey
但它不起作用，你知道为什么吗？@JSON根据mozilla文档，它应该是
event.metaKey
（即
const add=event.shiftKey | event.ctrlKey | event.metaKey
）来源：我在答案中包含了它。
<tr *ngFor="let obj of myObjectCollection" 
    [class.someCssClass]="isRowSelected(obj)" 
    (click)="setSelectedRow(obj, $event);">
...
</tr>

public setSelectedRow(bo: Bo, event: MouseEvent) {
  // support shift, control and the command key.
  const add = event.shiftKey || event.ctrlKey || event.metaKey;
  if (!add) {
    this.selectedRowSet.clear();
    this.selectedRowSet.add(bo);
    return;
  }

  // toggle selected record
  if (this.selectedRowSet.has(bo)) {
    this.selectedRowSet.delete(bo);
  }
  else {
    this.selectedRowSet.add(bo);
  }
}

<input (keydown)="onKey($event)"` ...