Ng-repeat et ng, si l'utilisation pour html td

Question

Je reçois un JSON qui ressemble à ceci (je n'ai pas accès à changer)

{ 
    "name": "mike" 
    "days": [ 
    { 
     "timeperiods": [ 
     { 
      "time": "08:00 - 12:00", 
      "hours": 4, 
      "task": "running" 
     }, 
     { 
      "time": "13:00 - 15:00", 
      "hours": 4, 
      "task": "triathlon" 
     } 
     ] 
    }, 
    { 
    "timeperiods": [ 
     { 
     "time": "08:00 - 12:00", 
     "hours": 3, 
     "task": "swimming" 
     } 
    ] 
    } 
    ] 
} 

Son pas un complet JSON Exemple. Habituellement, il y aurait 6 jours d'objets. Mais je pense que montrer 2 objets devrait montrer mon problème. Je crée une table en html qui me montre les tâches d'un utilisateur certains jours. (je sauvegarder les données JSON dans une variable de portée avec le nom weekplan.)

<table> 
    <thead> 
    <tr> 
     <th>Time</th> 
     <th>Monday</th> 
     <th>Tuesday</th> 
     <th>Wedesday</th> 
     <th>Thursday</th> 
     <th>Friday</th> 
     <th>Saturday</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr ng-repeat="day in weekplan.days[0].timeperiods"> 
     <td>{{day.time}}</td> 
     <td ng-if="day.hours == 0"><div></div></td> 
     <td ng-if="day.hours != 999 && day.hours != 0">Time for Workout!!</td> 

    </tr> 
    </tbody> 
</table> 

Il ne peut être un ng-vrai si jamais les deux. Mon problème est d'afficher correctement les colonnes. Cet exemple de table fonctionne mais seulement pour la colonne de temps et la colonne de lundi. Mais je ne sais pas comment le faire fonctionner tous les jours de la semaine. J'ai pensé à utiliser ng-if et ng-repeat sur le même objet td mais ça n'a pas vraiment marché. (J'ai besoin à la fois ng-si pour les règles CSS que j'ai enlevé de cet exemple, cela ne fait pas partie du problème). Qu'est-ce que je veux dans la fin est une table qui montre soit un champ vide pendant une certaine période ou un champ où il est dit "Time for Workout". Et ceci pour tous les jours de la semaine.

Answer 1

Vous avez description très déroutant, mais si logiquement présenter votre JSON il ressemblera à quelque chose comme:

HTML

<table> 
    <thead> 
     <tr> 
     <th>Time</th> 
     <th>Monday</th> 
     <th>Tuesday</th> 
     <th>Wedesday</th> 
     <th>Thursday</th> 
     <th>Friday</th> 
     <th>Saturday</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="day in weekplan.days"> 
     <td data-ng-repeat="period in day.timeperiods"> 
      <span>{{day.time}}</span> 
      <span ng-if="day.hours == 0"></span> <!-- why it is even exist? --> 
      <span ng-if="day.hours != 999 && day.hours != 0">Time for Workout!! </span> 
     </td> 
     </tr> 
    </tbody> 
    </table>