html - ng-repeat suprime duplicate and table format -
i have controller this:
var myapp = angular.module('myapp',[]); myapp.controller('preguntasctrl', function($scope) { $scope.preguntas = [ { "pregunta_id": "1", "pregunta": "pregunta a", "opcion": "1", }, { "pregunta_id": "1", "pregunta": "pregunta a", "opcion": "2", }, { "pregunta_id": "1", "pregunta": "pregunta a", "opcion": "3", }, { "pregunta_id": "2", "pregunta": "pregunta b", "opcion": "1", }, { "pregunta_id": "2", "pregunta": "pregunta b", "opcion": "2", }, { "pregunta_id": "2", "pregunta": "pregunta b", "opcion": "3", }, { "pregunta_id": "3", "pregunta": "pregunta c", "opcion": "1", }, { "pregunta_id": "3", "pregunta": "pregunta c", "opcion": "2", }, { "pregunta_id": "3", "pregunta": "pregunta c", "opcion": "3", } ] }); i'm using ng-repeat create dynamic table, this:
<tr ng-repeat="obj in preguntas"> <td> <span ng-bind="obj.pregunta_id"></span> </td> <td> <span ng-bind="obj.pregunta"></span> </td> <td> <span ng-bind="obj.opcion"></span> </td> </tr> but need create following table:
<tr> <td>1</td> <td colspan="3">pregunta a</td> </tr> <tr> <td></td><td>1</td><td>2</td><td>3</td> </tr> <tr> <td>2</td> <td colspan="3">pregunta d</td> </tr> <tr> <td></td><td>1</td><td>2</td><td>3</td> </tr> <tr> <td>3</td> <td colspan="3">pregunta c</td> </tr> <tr> <td></td><td>1</td><td>2</td><td>3</td> </tr> i need way eliminate duplicating values pregunta_id , pregunta, dynamically
i need show once , not 3 times
take @ angular-filter's groupby.
it provides filter group columns that:
$scope.players = [ {name: 'gene', team: 'alpha'}, {name: 'george', team: 'beta'}, {name: 'steve', team: 'gamma'}, {name: 'paula', team: 'beta'}, {name: 'scruath', team: 'gamma'} ]; --
<ul> <li ng-repeat="(key, value) in players | groupby: 'team'"> group name: {{ key }} <ul> <li ng-repeat="player in value"> player: {{ player.name }} </li> </ul> </li> </ul> <!-- result: group name: alpha * player: gene group name: beta * player: george * player: paula group name: gamma * player: steve * player: scruath --> otherwise have map data yourself:
$scope.preguntas = [ { "pregunta_id": "1", "pregunta": "pregunta a", "opcion": ["1", "2", "3"] }, { "pregunta_id": "2", "pregunta": "pregunta b", "opcions": ["1", "2", "3"] } ]; --
<tr ng-repeat-start="obj in preguntas"> <td ng-bind="obj.pregunta_id"></td> <td colspan="3" ng-bind="obj.pregunta></td> </tr> <tr ng-repeat-end> <td ng-repeat="opcion in obj.opcions" ng-bind="opcion"></td> </tr>