можем ли мы связать (щелкнуть) событие при создании элемента html в angular 8?

Question

Я пытаюсь создать HTML поля ввода по нажатию кнопки «плюс» с кодом ниже HTML:

<button type='button' value='Add Button' class="btn btn-primary add-multiple-text-btn" id='addButton' (click)="addMultipleInput()"><i class="icon icon-plus"></i></button>

ts:

addMultipleInput(){
      if(this.counter>7){
        $(".add-error-msg").show().delay( 10000 ).hide(0);
        return false;
      }
      var newTextBoxDiv = $(document.createElement('div')).attr("id", 'TextBoxDiv' + this.counter).attr("class","d-flex TextBoxDiv form-group");
      newTextBoxDiv.after().html('<label class="mr-3 pt-1" for="textbox'+this.counter+' ">'+ this.counter + ' </label>' +
            '<input type="text" class="form-control validate width80" style="width:80%" name="textbox' + this.counter +
            '" id="textbox' + this.counter + '" value="" >'+
            '<span class="delete-inputs"><i class="icomoon icon-trash2 text-danger d-inline-block pt-2 pl-2" **(click) = "deleteInput()"** title="Delete" id="deleteInput'+this.counter+'"></i></span>');
      newTextBoxDiv.appendTo("#TextBoxesGroup");

      this.counter++;
    }

deleteInput() {
      alert("clicked");
    }

мы можем связать (click) = "deleteInput ()" при создании поля ввода? И как мы создадим определение функции deleteInput () в том же файле? Помощь будет оценена. Код смешан с angular и jquery. Я новичок в angular

Answer 1

Вы можете использовать список для своих функций. Когда кто-то нажимает кнопку «Добавить» или «Удалить», вы можете удалить или добавить данные в свой список, а когда вы обновляете свою таблицу, вы можете увидеть свои изменения. Если вы хотите изменить кнопку и атрибуты, вы должны изменить свою кнопку с помощью кода скрипта.