Как я могу показать текст нажал?

Question

У меня есть пустой div и список из 3 элементов под ним. Как я могу показать нажатый текст в пустом div? Спасибо

<div></div>
<span>link one</span>
<span>link two</span>
<span>link three</span>

Answer 1

Вы должны объявить переменную глобально в компоненте

 linkValue: string; 

Тогда ваш HTML должен выглядеть так:

    <div style="color:green">{{linkValue}}</div>
    <br/>
    <br/>
    <span (click)="linkValue=$event.target.innerText">link one</span>
    <br/>
    <span (click)="linkValue=$event.target.innerText">link two</span>
    <br/>
    <span (click)="linkValue=$event.target.innerText">link three</span> 
    <br/>

Пример демонстрации

Извините! После того, как разместил этот ответ, я увидел ваш комментарий.

Answer 2

Здесь работает Пример

 myItems=[{name:"link"},{name:"link1"},{name:"link2"},{name:"link3"}]
 selectedLink;
 clickeMe(input) : void{
    console.log('event element',input);
    this.selectedLink=JSON.stringify(input);
  }

.html

<span>select one</span>

    <div>{{selectedLink}}</div>

    <div>
       <span (click)='clickeMe(item)' *ngFor="let item of myItems"> 
        {{item.name}} 
       </span>
    </div>

Answer 3

Ниже приведен HTML-код.

    <div>{{selectedLink}}</div>

    <div>
       <span (click)='linkClicked(item.LinkName)' *ngFor="let item of Items"> 
        {{item.LinkName}} 
       </span>
    </div>

, а ниже - машинописный код

    selectedLink: string; // declare global variable 

    //Add this method 
    linkClicked(linkName:string){
     this.selectedLink = linkName;
    }