title: AngularJS - Show a form from a table row
body: <p>I have a table with <code>materials</code> and when I click I want to show a form with all the data related to the row. What is the best approach to do that?</p>
  
  <p>You can see my code below</p>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;section ng-controller="materialController as materialCtrl"&gt;
      &lt;table class="table table-hover"&gt;
          &lt;th&gt; Nombre &lt;/th&gt;
          &lt;th&gt; Descripción &lt;/th&gt;
          &lt;tr ng-repeat="material in materials" ng-click="materialCtrl.openForm()"&gt;
              &lt;td&gt;
                  {{material.name}}
              &lt;/td&gt;
              &lt;td&gt;
                  {{material.description}}
              &lt;/td&gt;
          &lt;/tr&gt;
      &lt;/table&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p><strong>Controller</strong></p>
  
  <pre><code>app.controller("materialController", ["$scope", "$http", function($scope, $http){        
  
         $http.get('material').success(function(data){
             $scope.materials = data;
         });
  
         this.openForm = function(){
             // Do something
         };
  
  }]);
  </code></pre>