إضافة كلمة لإدخال النص عن طريق النقر على زر في مؤشر النص في Angular (add word to input text by click button into text pointer in angular)

كيفية إضافة متغيرات إلى النص الكبير بحيث يمكن استبداله في وقت لاحق.

المراجع:
https://g.co/gemini/share/124bdc811bb8

https://g.co/gemini/share/32d413d50a19

التطبيق الفعلي:

  //----------- Add Words -----------------------

  inputText = '';

  addWord(newWord: string) {

    const textAreaEl = this.telegramMessage.nativeElement;

    const selectionStart = textAreaEl.selectionStart;

    const selectionEnd = textAreaEl.selectionEnd;

    // Insert the new word at the selection start

    this.inputText = this.telegramMessage.nativeElement.value.substring(0, selectionStart) + newWord + this.telegramMessage.nativeElement.value.substring(selectionEnd);

    this.telegramMessage.nativeElement.value = this.inputText;

    // Adjust cursor position after insertion (might require additional logic)

    textAreaEl.selectionStart = selectionStart + newWord.length;

    textAreaEl.selectionEnd = selectionStart + newWord.length;

    // Additional logic for textarea selection (optional)

    this.telegramMessage.nativeElement.focus(); // Ensure textarea is focused

  }

<mat-chip-set>

    <mat-chip (click)="addWord(item.value)" *ngFor="let item of varibles">

        <mat-icon matChipAvatar class="icon-edit">{{item.icon}}</mat-icon>

        {{item.name |

            translate}}

    </mat-chip>                      

</mat-chip-set>