Estoy tratando de crear una lista de datos, con un botón correspondiente en cada fila de la lista. Espero hacerlo de modo que cuando un usuario haga clic en el botón, muestre los datos a continuación (usando ng-show) solo para esa línea específica. Estaba pensando en la línea del botón de alguna manera guardando la "ID" en una variable, y luego la tabla a continuación se filtró en esa ID. Pero está resultando más fácil decirlo que hacerlo.
<div ng-controller="MainCtrl"> <h1>Select relevant information from a list</h1><br> <table> <tr> <th>Name</th> <th>ID</th> </tr> <tr ng-repeat = "x in userInfo"> <td>{{x.name}}</td> <td>{{x.ID}}</td> <td><button ng-click = "viewMore()">View More</button></td> </tr> </table><br><br> <div ng-show = "showDiv"> <table><h3>Selected Information</h3> <tr> <th>Name (Selection)</th> <th>Hobby (Selection)</th> <th>ID (Selection)</th> </tr> <tr ng-repeat = "x in userInfo"> <td>{{x.name}}</td> <td>{{x.hobby}}</td> <td>{{x.ID}}</td> </tr> </table><br><br> </div> </div> import angular from 'angular'; angular.module('plunker', []).controller('MainCtrl', function($scope) { $scope.userInfo = [{"name":"John", "hobby":"fishing", "ID":"123"}, {"name":"Bob", "hobby":"Golf", "ID":"199"}, {"name":"Jerry", "hobby":"Football", "ID":"aAAa"}]; $scope.viewMore = function(){ $scope.showDiv = true; } });https://plnkr.co/edit/u2uZ008S0Uv6TANM?open=lib%2Fscript.js&deferRun=1
puede enviar la identificación como parámetro a su función:
<button ng-click = "viewMore(x.ID)">View More</button>luego use esa identificación para establecer un campo de identificación seleccionado en su alcance -
$scope.selectedId = null; $scope.viewMore = function(id){ $scope.showDiv = true; $scope.selectedId = id; }luego use esa identificación para filtrar su usuario -
<tr ng-repeat = "x in userInfo | filter: { ID: selectedId }"> <td>{{x.name}}</td> <td>{{x.hobby}}</td> <td>{{x.ID}}</td> </tr>Estás usando un Angular muy antiguo. consigue lo último para empezar. Luego, cree un componente secundario que deba repetirse y aliméntelo con datos de su matriz.