Syntax Error in Angular js passing parameter from html page http.get() data

Question

I am trying to pass a parameter from the html page to delete a row from database. The http.get() method returns the data for all books, and I'm passing the id for a certain book to delete it. but its return synatx error.

here is the html page with delete button having the function call on ng-click

    <div class="container">

      <table class="table">
        <thead>
          <tr>
            <th>Id</th>
            <th>Name of Book</th>
            <th>Author</th>
            <th>Description</th>
            <th>No of books available</th>
          </tr>
        </thead>

        <tbody>

          <tr ng-repeat = "book in libraryBooks | filter:keyword">
            <td>{{book.id}}</td>
            <td>{{book.name}}</td>
            <td>{{book.author}}</td>
            <td>{{book.description}}</td>
            <td>{{book.count}}</td>

<td><button ng-click = "removeItem({{book.id}})">remove</button></td>
      </tr>

        </tbody>
      </table>
    </div>

this is returning synatx error in the browser console I am passing this parameter to recieve in the controller to call a hibernate function to delete the book with that specific id

Answer 1

you can pass just book.id

like this:

<button ng-click = "removeItem(book.id)">remove</button>

Answer 2

Because you can't use {{}} interpolation directive inside ng-click directive, as you can directly access scope variable on ng-click directive

ng-click="removeItem(book.id)"

Answer 3

ng-click is angular directive. it accepts the argument from scope. so you can use following line

ng-click="removeItem(book.id)"