title: Passing Object from a table row to bootstrap modal
body: <p>I'm trying to put to a modal the attributes of a clicked table row. I am using angularjs. Nothing happens in my code:
  Basically this is my html code like below:</p>
  
  <pre><code>&lt;tr ng-repeat="pokemons in pokemon"&gt;
      &lt;td&gt;{{pokemons.pokemon_number}}&lt;/td&gt;
      &lt;td&gt;&lt;a href="javascript:;" ng-click="getDetails(pokemons)" id="clickable"&gt;{{pokemons.pokemon_name}}&lt;/a&gt;&lt;/td&gt;
      &lt;td&gt;{{pokemons.type1}}&lt;/td&gt;
      &lt;td&gt;{{pokemons.type2}}&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>Then this is in my script tag:</p>
  
  <pre><code>var myApp = angular.module('myApp', [])
  myApp.controller('SimpleController', ['$scope', '$http', function($scope, $http) {
      $scope.findPokemon = function(filterKey){
          $http.get('pokemon/search-by-name/' + filterKey).then(function(response) {
              $scope.pokemon = response.data
          })
      } 
      $scope.getDetails = function(pokemons){
          $scope.pokemonDetails = pokemons
          $('#viewModal').modal('show');
      } 
  }]) `
  </code></pre>
  
  <p>Modal:</p>
  
  <pre><code>    &lt;div id="pokemon-zoom" class="modal"&gt;
          &lt;div class="modal-content animate"&gt;
              &lt;div class="imgcontainer"&gt;
                  &lt;span onclick="document.getElementById('pokemon-zoom').style.display='none'" class="close" title="Close Modal"&gt;&amp;times;&lt;/span&gt;
              &lt;/div&gt;
              &lt;div class="modal-container"&gt;
                  &lt;img id="pokemon-image" src="Bulbasaur.jpg" height="200px" width="200px"&gt;
                  &lt;div class="pokemon-details"&gt;
                      &lt;h1&gt;Pokemon Data&lt;/h1&gt;
                      &lt;div id="pokemon-data-text"&gt;
                          &lt;p&gt;Pokemon no: {{pokemonDetails.pokemon_number}}&lt;/p&gt;
                          &lt;p&gt;Type1: {{pokemonDetails.type1}}&lt;/p&gt;
                          &lt;p&gt;Type2: {{pokemonDetails.type12}}&lt;/p&gt;
                          &lt;p&gt;&lt;/p&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="options"&gt;
                      &lt;button class="options-link" href="#"&gt;Edit&lt;/a&gt;
                      &lt;button class="options-link" href="#"&gt;Delete&lt;/a&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>Btw some parts there seem unnecessary i just included them </p>