Générer la table avec rowspan à l'aide Angulaire 2
J'ai une structure de données comme ceci:
[
"category1": {
"name": "Cat 1",
"competences": [{
"name": "Comp 1",
"users": [{
"name": "user1",
"level": 99,
}, {
"name": "user2",
"level": 99,
},… {
"name": "userN",
"level": 9001,
}]
}, {
"name": "Comp 2",
"users": [{
"name": "user1",
"level": 99,
}, {
"name": "user2",
"level": 99,
},… {
"name": "userN",
"level": 9001,
}]
}]
},
"category2": {
"name": "Cat 2",
"competences": [{
"name": "Comp 3",
"users": [{
"name": "user1",
"level": 99,
}, {
"name": "user2",
"level": 99,
},… {
"name": "userN",
"level": 9001,
}]
}, {
"name": "Comp 4",
"users": [{
"name": "user1",
"level": 99,
}, {
"name": "user2",
"level": 99,
},… {
"name": "userN",
"level": 9001,
}]
},… {
"name": "Comp N",
"users": [{
"name": "user1",
"level": 99,
}, {
"name": "user2",
"level": 99,
},… {
"name": "userN",
"level": 9001,
}]
}]
},
"categoryN": {
"name": "Cat N",
"competences": [{
"name": "Comp 5",
"users": [{
"name": "user1",
"level": 99,
}, {
"name": "user2",
"level": 99,
},… {
"name": "userN",
"level": 9001,
}]
}]
}
]
En fait une liste de catégories, avec toutes les compétences au sein de cette catégorie, et pour chaque type de compétence, un dossier pour chaque utilisateur (si le nombre d'utilisateurs sera la même pour chaque compétence).
Maintenant, je veux générer une table à partir de ceci:
+----------------+--------+--------+---+--------+
| | user 1 | user 2 | … | user N |
+-------+--------+--------+--------+---+--------+
| Cat 1 | Comp 1 | 99 | 99 | … | 9001 |
| +--------+--------+--------+---+--------+
| | Comp 2 | 99 | 99 | … | 9001 |
+-------+--------+--------+--------+---+--------+
| Cat 2 | Comp 3 | 99 | 99 | … | 9001 |
| +--------+--------+--------+---+--------+
| | Comp 4 | 99 | 99 | … | 9001 |
| +--------+--------+--------+---+--------+
| | … | … | … | … | … |
+ +--------+--------+--------+---+--------+
| | Comp N | 99 | 99 | … | 9001 |
+-------+--------+--------+--------+---+--------+
| Cat 3 | Comp 5 | 99 | 99 | … | 9001 |
| +--------+--------+--------+---+--------+
| | Comp 6 | 99 | 99 | … | 9001 |
+-------+--------+--------+--------+---+--------+
Qui signifie rowspan
seront impliqués. Cependant, je ne peux pas obtenir une poignée sur la façon de commencer.
Si j'écris
<tr *ngFor="let category for categories">
<td [rowspan]="category.components.length">
- Je obtenir
Can't bind to 'rowspan' since it isn't a known native property
Donc ma question est: comment faire pour lier un modèle de la valeur à la rowspan propriété?
OriginalL'auteur GergelyPolonkai | 2016-05-25
Vous devez vous connecter pour publier un commentaire.
Rowspan lui-même n'est pas natif de la propriété, il est un attribut. Donc, ce que vous avez à faire est d'accéder à l'élément de l'attribut rowspan comme suit:
Cela devrait faire l'affaire et vous êtes maintenant en définissant la valeur pour
rowspan
. Vous doit l'utilisation de l'attribut de liaison lorsqu'il n'existe aucun élément de la propriété de se lier à. Si vous voulez en savoir plus, consultez les la documentation officielle.certaines mises à jour de la documentation angulaire.io/guide/modèle-syntaxe#attribut de liaison
OriginalL'auteur LordTribual