ionic 3 angualar 5 template data table No data available in table

chuk
Javascript

Bonjour,

Voila je rencontre un petit problème avec mon code .

qu'on je met le ngFor dans la balise tr du table

pour inserer des données dynamiques

les caractéristiques du table (tri, recherche , pagination) ne fonctionne plus, il me donne soit un table normale soit no data avalable

7 réponses

chuk
Auteur

Merci d'avance de votre aide

Defy

un peut de code serait le bienvenu pour savoir comment on peut t'aider

chuk
Auteur

ouii alors voila le code html que j'utilise puisque je travail avec ionic c presque la meme structure que angular 4/5

//document.html

 <table class="table table-bordered data-table"> 
                  <thead>
                    <tr>
                      <th>Titre</th>
                      <th>Actions</th>
                    </tr>
                  </thead>
                  <tbody>

                  <tr *ngFor="let document of documents">
                      <td>{{document.titre}}</td>
                      <td class="center">
                         <a href="" (click)="deleteDoc(document.id)"> <span class="icon"><i class="icon-trash"></i></span>  </a>
                      </td>
                    </tr>

                  </tbody>

                </table>

//index.html

<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/bootstrap-responsive.min.css" />
<script src="assets/js/jquery.uniform.js"></script> 
<script src="assets/js/select2.min.js"></script> 
<script src="assets/js/jquery.dataTables.min.js"></script> 
<script type="text/javascript">
function initDataTable(){
  $('.table table-bordered data-table').dataTable();
}
</script>
chuk
Auteur

la methode qui permet la récupération des donnee depuis mon api

       private loadDoc() {
           this
               .documentService
               .getDocument()
               .subscribe((resp) => {
                   this.documents = resp;
                   this.totalRec = this.documents.length;
                   console.log(this.totalRec);
                   console.log(this.page);
                   console.log('my data'+resp);
                   //console.log(JSON.stringify(resp.json()));    
               });
       }
Defy

documents c´est un objet ou un tableau?

chuk
Auteur

C'est un objet (liste json) depuis une api rest

Defy

tu peut copier coller le retour du console.log de resp.