À l'aide de ng-repeat et ng-classe sur les lignes à l'intérieur d'un tableau
Je suis en utilisant AngularJS et de l'effet que je veux obtenir serait quelque chose de similaire à ce que ce serait de produire, en supposant qu'il serait de travailler (il n'est pas).
Vue
<tr ng-repeat='person in people' ng-class='rowClass(person)'>
<td>.....info about person...</td>
<td>.....info about person...</td>
<td>.....info about person...</td>
</tr>
Contrôleur
$scope.rowClass = function(person){
...return some value based upon some property of person...
}
Je me rends compte que ce code ne fonctionnera pas parce que person
est pas disponible pour ng-class
qu'il ne sera disponible que pour les objets à l'intérieur de chaque ligne. Le code est pour avoir une idée de ce que je suis en train de faire à travers: l'ie. Je veux être en mesure d'avoir des lignes de la table qui sont créés à l'aide de ng-repeat
dont la classe est également basé sur une condition qui dépend de l'accès à l'étendue de la fonctionnalité de la ligne elle-même, par exemple. person
. Je me rends compte que je pourrait juste ajouter ng-classe sur les colonnes, mais c'est ennuyeux. N'importe qui ont des idées?
- double possible de Comment puis-je conditionnellement appliquer des styles CSS en AngularJS?
Vous devez vous connecter pour publier un commentaire.
Cela devrait en fait les beaux travaux. La personne doit être disponible sur l'élément tr ainsi que sur ses enfants, car ils partagent le même champ d'application.
Cela semble bien fonctionner pour moi:
http://jsfiddle.net/xEyJZ/
En fait, vous peut utilisation de "personne" dans le contexte, il se réfère. Il existe sur le point d'être répétées ainsi que tous les éléments. La raison en est que toutes les directives sur un élément particulier de partager le même $objet de l'étendue. ng-repeat a une Priorité de 1000, il a déjà créé son $champ d'application et de mettre "personne" dans le il, donc "personne" est disponible à ng-classe.
Voir ce Plnkr:
http://plnkr.co/edit/ZI5Pv24U01S9dNoDulh6
Normalement, je tiens à donner une réponse complète, mais il y a trop de code impliqués dans ce peu de le faire. Il en sera de montrer seulement ce qui est le plus important et espère que tous ceux qui cherchent à ce sait comment l'utiliser. Ma dynamique JSON tableau a deux colonnes et de lignes, mais la principale chose qui compte pour ce bit est ng-show="$last". Cela devrait afficher uniquement la dernière ligne de la dynamique tableau JSON.