Discussion :

[thearno]

Bonjour,

Je découvre et fais joujou avec AngularJs depuis quelques jours et j'ai un problème : je souhaite afficher le contenu d'une table dans un tableau avec un ng repeat. Cette table contient 3 attributs, att1, att2, att3. Il se trouve que att3 est un id d'une autre table qui contient 2 attributs, attri1 ( att3 donc de la 1ere table) et attri2.

Je souhaite afficher dans mon tableau att1, att2 et attri2.

Je ne trouve pas quelle pourrait être la syntaxe correcte.

Quelqu'un pourrait il me mettre sur la piste ?

Merci

Exemple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
<div class="cms_table"><table class="cms_table"><tr valign="top" class="cms_table_tr"><td class="cms_table_td">att1</td>
<td class="cms_table_td">att2</td>
<td class="cms_table_td">attri2</td>
</tr>
<tr valign="top" class="cms_table_tr"><td class="cms_table_td">Bart</td>
<td class="cms_table_td">Simpson</td>
<td class="cms_table_td">Springfield</td>
</tr>
</table></div>

[Alkhan]

bonjour,

Ta dificulter se trouve a quel niveau ? la récupération des données ? l'utilisation du ng-repeat ?

Vu ton exemple je dirais ... l'uitlisation du ng-repeat !

Alors voila un exemple, dans lequel "datas" est un array contenant un objet avec les trois valeurs que tu souhaites afficher dans le tableau :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<tbody>
    <tr ng-repeat="data in datas">
	<td class="cms_table_td">{{ data.att1 }}</td>
	<td class="cms_table_td">{{ data.att2 }}</td>
        <td class="cms_table_td">{{ data.attri2 }}</td>
    </tr>
</tbody>

[thearno]

J'ai mal exposé mon problème, je vais donner un exemple concret :

J'ai deux tables :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 ville : [
        {
            id : "value",
            nom : "value",
            idDepartement : "value"
        }
    ],
departement : [
        {
            id : "value",
            nom : "value",
        }
    ]

J'affiche donc la liste de mes villes avec un ng repeat ville in villes par exemple.
Mais au lieu d'afficher l'idDepartement, je souhaite afficher le nom qui correspond :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<tr ng-repeat="ville in villes">
   <td>{{ville.id}}</td>
   <td>{{ville.nom}}</td>
   <td>{{departement.nom}}</td>
</tr>

J'ai essayé ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<td>{{departement[ville.idDepartement].nom}}</td>

Mais cela me retourne une position dans l'index.

[NoSmoking]

Bonjour,

Mais au lieu d'afficher l'idDepartement, je souhaite afficher le nom qui correspond

donc on peut considérer cela comme une redirection sur une entrée d'une autre table.
Dans ce cas j'aurais tendance à faire par exemple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
$scope.dataVilles = [{
  nom: 'Grenoble',
  idDepartement: '38'
},
{
  nom: 'Bordeaux',
  idDepartement: '33'
},
{
  nom: 'Marseille',
  idDepartement: '13'
},
{
  nom: 'Lyon',
  idDepartement: '69'
}];
$scope.dataDepartements = [{ /* la mise sous forme d'un Array n'est pas obligatoire */
  '38': {
    nom: 'Isère'
  },
  '33': {
    nom: 'Gironde'
  },
  '69': {
    nom: 'Rhône'
  },
  '13': {
    nom: 'Bouche du Rhône'
  }
}];

et dans le template

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<tr ng-repeat="ville in dataVilles">
    <td>{{ville.nom}}</td>
    <td>{{ville.idDepartement}}</td>
    <td>{{dataDepartements[0][ville.idDepartement].nom}}</td>
</tr>

[slim]

Salut,

et pourquoi ne pas avoir qu'un seul tableau en entrée ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
departement : [
        {
            id : "value",
            nom : "value",
            villes: [
                {
                    id : "value",
                    nom : "value"                    
                }
            ]
        }
    ]