Eu quero fazer uma tabela em que as td
são o nome e o preço de um item. E quero que o utilizador consiga procurar um item pelo seu nome através de um input
. Isso já está a funcionar. Mas a tabela não está a aparecer como eu quero, pois eu insiro o array num único td
e fico apenas com uma linha de items, enquanto que eu quero uma coluna.
Eu tenho assim:
Mas quero que os nomes apareçam em coluna e não em linha. O meu código é:
<div class="container">
<form class="navbar-form" role="search">
<div ng-app="myApp" ng-controller="namesCtrl">
<p>Pesquise um menu</p>
<p><input type="text" ng-model="test"></p>
</form>
<div class="row">
<div class="table-responsive">
<table class="table table-hover">
<thead>
<tr>
<th>Nome</th>
<th>Preço</th>
</tr>
</thead>
<tbody id="myTable">
<tr>
<td ng-repeat="x in names | filter:test">{{ x }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
script:
<script>
angular.module('myApp', []).controller('namesCtrl', function($scope) {
$scope.names = [
'Jani',
'Carl',
'Margareth',
'Hege',
'Joe',
'Gustav',
'Birgit',
'Mary',
'Kai'
];
});
</script>