title: How to get span value in Angular 4 using onClick event in Angular 4
body: <p><a href="https://i.stack.imgur.com/WflTP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/WflTP.png" alt="enter image description here"></a>I am working in an Angular 4 project ,In this I need to get the value which is in the Span tag on Onclick of an Image .
  I referred some Stackoverflow qustions but nothing is worked for me ...</p>
  
  <p>This is my HTML.</p>
  
  <pre><code> &lt;div class="col-sm-4"&gt;
       &lt;div class="card"&gt;
           &lt;div class="card-img-top card-img-top-250 one"&gt;
               &lt;img  class="img-fluid" "src="assets/Images/Popular_Products/3.jpg" alt="img1"&gt;
               &lt;img routerLink="/my-cart" class="img-fluid two" src="assets/Images/Popular_Products/10.jpg" alt="img2" onclick="getProductName()" &gt;
            &lt;/div&gt;
            &lt;div class="card-block pt-2"&gt;
                &lt;div class="col-sm-12 text-center card-text"&gt;
                    &lt;span #Pname&gt; iPhone&lt;/span&gt;
                    &lt;br&gt;
                    &lt;br&gt;
                    1500 $
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>This is my .ts file</p>
  
  <pre><code>getProductName(Pname: string) {
        this.http.get(`http://localhost:57036/api/data/CartCount/?ProductName=${Pname}`)
                 .subscribe(data =&gt; this.res = (data['ITEM_QTY']),
                           error =&gt; console.error(error));       
  } 
  </code></pre>
  
  <p>When I clicked on the image ,I want to get the value in the span tag and pass it to the API ,but in my case I can't get the span value .
  I am new to Angular4 please guide me to solve this .</p>