Chanchal Agarwal
Chanchal Agarwal

Reputation: 13

unable to print variable value inside angular function

I am new to Angular and I have written the following code but this code doesn't seems to be working for me.

html:

<form class= "ui large form segment">
  <h3 class= "ui header">Add a link</h3>

  <div class="field">
    <label for = "title">Title: </label>
    <input name= "title" #newtitle>
  </div>

  <div class="field">
    <label for = "link">Link: </label>
    <input name= "link" #newlink>
  </div>

<button (click) = "addArticle(newtitle, newlink)" class= "ui positive right floated button">
  Submit link
</button>

</form>

.ts

addArticle(title : HTMLInputElement, link : HTMLInputElement):boolean{
    console.log('Adding article with title: ${title.value} and link ${link.value}');
    return false;
  }

when I run the code I get below output in the console, don't know what I am doing wrong:

Adding article with title: ${title.value} and link ${link.value}

Upvotes: 1

Views: 161

Answers (2)

Sachin Kumar
Sachin Kumar

Reputation: 3240

Simply Replace single quotes with backtick

Upvotes: 0

Prerak Tiwari
Prerak Tiwari

Reputation: 3476

I think you are using Single Quote(') instead of backtick(`), try the below code, it should work

addArticle(title : HTMLInputElement, link : HTMLInputElement):boolean{
    console.log(`Adding article with title: ${title.value} and link ${link.value}`);
    return false;
  }

Upvotes: 1

Related Questions