AngularJS - Show a form from a table row - angularjs

Question

I have a table with materials 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?
You can see my code below
index.html
<section ng-controller="materialController as materialCtrl">
<table class="table table-hover">
<th> Nombre </th>
<th> Descripción </th>
<tr ng-repeat="material in materials" ng-click="materialCtrl.openForm()">
<td>
{{material.name}}
</td>
<td>
{{material.description}}
</td>
</tr>
</table>
</section>
Controller
app.controller("materialController", ["$scope", "$http", function($scope, $http){
$http.get('material').success(function(data){
$scope.materials = data;
});
this.openForm = function(){
// Do something
};
}]);

Answer 1

First, I think you could solve this by storing the material in some scope variable and using that to determine which row has been clicked. Second, you're doing this controller thing wrong and I will show you how to fix it. You're referencing the controller directly which is probably not the best practice. I suggest you change your code to look like this
app.controller("materialController", ["$scope", "$http", function($scope, $http){
$http.get('material').success(function(data){
$scope.materials = data;
});
$scope.selectedRow;
$scope.openForm = function(material){
$scope.selectedRow = material;
};
}]);
<!--reference controller directly -->
<section ng-controller="materialController">
<table class="table table-hover">
<th> Nombre </th>
<th> Descripción </th>
<!-- reference openForm from scope -->
<tr ng-repeat="material in materials" ng-click="openForm(material)">
<td>
{{material.name}}
</td>
<td>
{{material.description}}
</td>
</tr>
</table>
</section>
then for each material if you have some form you want to show or anything else
<form ng-repeat="material in materials" ng-show="selectedRow == material">
Also, this isn't so important but more of a best practice, you should extract your http request into a service. https://docs.angularjs.org/guide/services