PHP - Passar consulta no modal

Olá, estou tentando visualizar uma receita utilizando um modal.

O problema é que não consigo passar os dados de acordo com o id selecionado.

Ao clicar no botão de visualizar, mostra apenas o primeiro registro da consulta.

Gostaria de um help, visualizar a consulta de acordo com o registro.

Obrigado.

Segue o codigo:

<table class="table table-bordered tabela" id="receita2" width="100%" cellspacing="0">
 <thead>
 <tr>
 <th>COD.</th>
 <th>Data Receita</th>
 <th>Nome Receita</th>
 <th>Categoria</th>
 <th>Visualizar</th>
 <th>Editar</th>
 <th>Deletar</th>
 </tr>
 </thead>
 <tfoot>
 <tr>
 <th>COD.</th>
 <th>Data Receita</th>
 <th>Nome Receita</th>
 <th>Categoria</th>
 <th>Visualizar</th>
 <th>Editar</th>
 <th>Deletar</th>
 </tr>
 </tfoot>
 <tbody>
 <?php
 while($linha = mysqli_fetch_array($consulta_receita)){

 echo '<tr><td>000'.$linha['id_receita'].'</td>';
 echo '<td>'.$linha['data_receita'].'</td>';
 echo '<td>'.$linha['nome_receita'].'</td>';
 echo '<td>'.$linha["nome_categoria"].'</td>';
 ?>

<!-- MODAL -->
<!-- ----------------------- -->

<?php echo '<div id='.$linha["id_receita"].'>';?>
 <div class="modal fade" id="visuReceitaModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
 <div class="modal-dialog" role="document">
 <div class="modal-content">
 <div class="modal-header">
 <h5 class="modal-title" id="exampleModalLabel">Receita</h5>
 <button class="close" type="button" data-dismiss="modal" aria-label="Close">
 <span aria-hidden="true">×</span>
 </button>
 </div>
 <div class="modal-body">
 <?php
 echo '<p><span class="visuReceita">Data de criação: </span>'.$linha['data_receita'].'</p>';
 echo '<p><span style="font-weight: bold;">Nome da receita: </span>'.$linha['nome_receita'].'</p>';
 echo '<p><span style="font-weight: bold;">Categoria: </span>'.$linha['nome_categoria'].'</p>';
 echo '<br>';
 ?>
 <h5 class="modal-title" id="exampleModalLabel">Ingredientes</h5>

 </div>
 <div class="modal-footer">
 <button class="btn btn-secondary" type="button" data-dismiss="modal">Fechar</button>
 </div>
 </div>
 </div>
 </div>
</div>

<!-- Fim MODAL -->
<!-- ----------------------- -->

 <td><?php
 echo '<a class="btn btn-primary" href="#'.$linha['id_receita'].'" data-toggle="modal" data-target="#visuReceitaModal"><i class="fas fa-fw fa-eye"></i></a>';
 ?></td>
 <td><a class="btn btn-warning" href="?pagina=inserir_receita&editar=<?php echo $linha['id_receita']; ?>"><i class="fas fa-fw fa-edit"></i></a></td>
 <td><?php echo "<a class='btn btn-danger' href='deleta_receita.php?id_receita=" . $linha["id_receita"] . "' data-confirm='Tem certeza de que deseja excluir o item selecionado?'>";?><i class="fas fa-fw fa-trash"></i></a></td></tr>
 <?php
 }
 ?>

 </tbody>
</table>