用焦点值填充其余输入文本字段

Question

我有3-4种产品及其价格以表格格式显示。 我的页面看起来像

我的代码看起来像

<table>
      <tr *ngFor="let val of prods">
        <td class="sea">
          <input type="text" [(ngModel)]="val.key" />
        </td>
        <td *ngFor="let sale of val.sales">
          <input  type="text" [(ngModel)]="sale.value" />
        </td>
      </tr>
    </table>

即变量绑定到每个文本框。

现在我需要的是 我必须创建一个新的快捷方式，以使用当前聚焦元素（按行）中的值自动填充所有值。 因此，如果我在第一行的第一列输入100，然后按F2， 第一行中的所有值都应替换为100。

我可以使用以下代码来监听keypress事件并获取当前关注的元素的值，

@HostListener('document:keydown', ['$event'])
  handleKeyboardEvent(event: KeyboardEvent) {
    if (event.code === 'F2') {
      if (document.activeElement['value']) {

      }
    }
  }

但是不知道如何将此值填充到所有同级输入字段中。 我知道在angular中使用jQuery是一个坏主意。 有帮助以角度的方式解决这个问题吗？

Answer 1

对于正在寻找类似情况的解决方案的任何人。

<table>
  <tr *ngFor="let val of prods">
  <td class="sea">
      <input type="text" [(ngModel)]="val.key" />
  </td>
  <td *ngFor="let sale of val.sales ; let k = index">
      <input (keydown)="onKeydown($event, k, val )"  type="text" [(ngModel)]="sale.value" />
  </td>
  </tr>
</table>


onKeydown(event, k, arr) {
  if (event.code === 'F2' && k === 0) {
    if (document.activeElement['value']) {
      const elemval = document.activeElement['value'];
      for (const elmnt of arr.sales) {
        elmnt.value = elemval;
      }
    }
  }
}