как удалить в настоящее время нажал html тег div угловой 4

Question

ниже мой тег div

removeObject(event) {
    console.log(event);
    console.log(event.target);
    event.target.hidden = true;
    //event.target.classList.add('class3');
  }

<div class="col" (click)="removeObject($event)">Rate Limit</div>

, который я хочу заменить текстовым полем при нажатии

Answer 1

Вместо того, чтобы удалять div и показывать текстовое поле, вы можете использовать свойство «contentEditable» для переключения между редактируемым и нередактируемым div.

Нет необходимости поддерживать здесь еще одно текстовое поле.

removeObject(event) {
    console.log(event);
    console.log(event.target);
    event.target.contentEditable= !event.target.contentEditable;
    //event.target.classList.add('class3');
  }

Answer 2

Используйте *ngIf для этого, как это.Например, вам нужна переменная в вашем компоненте hidden.

<div class="col" *ngIf="!hidden" (click)="removeObject($event)">Rate Limit</div>
<input name='limit' *ngIf="hidden">

И ваш метод ts

removeObject(event) {
    console.log(event);
    console.log(event.target);
    this.hidden = !this.hidden;
}

Примерно так.Если вы сохраните значение ввода или что-то еще, вы можете снова установить значение false в false, и div покажет, что вам нужно.