Как открыть модальное окно для конкретного объекта из таблицы

У меня есть html-таблица объектов, и так же есть кнопка для редактирования объекта, а еще добавить объект в таблицу, они должны открывать модальное окно: [UI][1].

Я реализовал добавление через модальное окно следующим образом:

@Component({
  selector: 'app-add-sensor-modal',
  templateUrl: './add-sensor-modal.component.html',
  styleUrls: ['./add-sensor-modal.component.css']
})
export class AddSensorModalComponent implements OnInit{
  @Input() active: boolean
  @Input() sensor: ISensor = {
    id: 0,
    name: '',
    model: '',
    range_from: 0,
    range_to: 0,
    type: '',
    unit: '',
    location: '',
    description: ''
  }
  @Output() onModal = new EventEmitter<boolean>()
  @Output() onSensors = new EventEmitter<ISensor>()

  sensorTypes = [
    {name: "Pressure", value: "Pressure"},
    {name: "Voltage", value: "Voltage"},
    {name: "Temperature", value: "Temperature"},
    {name: "Humidity", value: "Humidity"}
  ]
  sensorUnits = [
    {name: "Bar", value: "bar"},
    {name: "Voltage", value: "voltage"},
    {name: "Degree", value: "°С"},
    {name: "Percent", value: "%"}
  ]
  form: FormGroup

  ngOnInit(): void {
    this.fillForm()
  }

  closeModal(){
    this.onModal.emit(false)
  }

  addSensor(){
    let sensor: ISensor = getSensorFromForm(this.form)
    this.onSensors.emit(sensor)
    this.closeModal()
    this.fillForm()

  }

  private fillForm(){
    this.form = new FormGroup({
      name: new FormControl(this.sensor.name),
      model: new FormControl(this.sensor.model),
      range_from: new FormControl(this.sensor.range_from),
      range_to: new FormControl(this.sensor.range_to),
      type: new FormControl(this.sensor.type),
      unit: new FormControl(this.sensor.unit),
      location: new FormControl(this.sensor.location),
      description: new FormControl(this.sensor.description)
    })
  }
}

Я добавил это модальное окно в конец html-файла:

  <app-add-sensor-modal
    [active]="addSensorModalActive"
    (onModal)="changeAddSensorModal($event)"
    (onSensors)="addSensor($event)"
  ></app-add-sensor-modal>

Итак, это работает отлично, но теперь у меня появилась необходимость редактировать объекты и мне нужно вызывать эту же модалку, но заполненную уже полями определенного объекта

<tr class="table-body-line" *ngFor="let sensor of sensors.slice(currentPage*4, currentPage*4 + 4)">
        <td class="edit-sensor">
          <button class="edit-item">&#9998;</button>
        </td>
        <td class="table-body-col name">{{sensor.name}}</td>
        <td class="table-body-col">{{sensor.model}}</td>
        <td class="table-body-col">{{sensor.type}}</td>
        <td class="table-body-col">{{sensor.range_from}}-{{sensor.range_to}}<span *ngIf="sensor.unit == '%'">%</span></td>
        <td class="table-body-col">{{sensor.unit}}</td>
        <td class="table-body-col">{{sensor.location}}</td>
        <td class="delete-sensor">
          <button
            class="delete-item"
            (click)="deleteSensor(sensor)"
          >&#10006;</button>
        </td>
      </tr>

Как мне это реализовать, если я модальное окно поставлю снова в конец html, то я не смогу туда передать sensor, а в цикл ее не вставишь? [1]: https://i.stack.imgur.com/d9E2o.png