Parcourir un Array de ma classe "Marker"
Bien le bonjour, bonne reprise pour ceux qui viennent de reprendre le boulot et bon courage à vous ! :lol:
Alors, j'ai un petit soucis sur mon projet, qui est un projet Web fait en Angular version 6. Je possède des données dans ma base de données faites FireBase que je récupère facilement dans mon fichier TypeScript, suite à la récupération des données j'aimerai les stockés dans un tableau de ma classe appelé "Marker".
Dans un premier temps voici le code de ma classe Marker :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
| export class Marker {
photo: string;
title: string;
descri: string;
type: string;
lat: number;
lng: number;
constructor(public titleSpot: string,
public description: string,
public typeSpot: string,
public latitude: number,
public longitude: number,
) {
this.title = titleSpot;
this.descri = description;
this.type = typeSpot;
this.lat = latitude;
this.lng = longitude;
}
} |
Donc effectivement je récupère toutes les données qui vont bien dans ma base de données pour pouvoir créer des objets Marker et les mettres dans un tableaux. Pour cela dans mon TypeScript j'ai écrit cela :
Code:
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
|
markers: Marker[];
constructor(private route: ActivatedRoute, private spotService: SpotService, private router: Router) {
this.getAndCreateAllLocation();
}
getAndCreateAllLocation() {
var ref = firebase.database().ref('/spots/');
var query = ref.orderByKey();
query.once("value")
.then(function(snapshot) {
snapshot.forEach(function(childSnapshot) {
var key = childSnapshot.key;
var childData = childSnapshot.val();
console.log(childData.titleSpot);
console.log(childData.description);
console.log(childData.typeSpot);
console.log(childData.latitude);
console.log(childData.longitude);
this.markers.push(new Marker(childData.titleSpot, childData.description, childData.typeSpot, childData.latitude, childData.longitude));
});
});
for(let myMarker of this.markers) {
console.log(myMarker);
}
} |
Ce code me génére une erreur dans la console :
Code:
1
2
| TypeError: Cannot read property 'markers' of undefined
TypeError: Cannot read property 'markers' of undefined |
Je ne sais pas si je m'y prend correctement, suite à cela je souhaiterai récupérer la latitude et longitude de mon Marker pour pouvoir l'utilisé dans mon code HTML. Je sais pas si je m'y prend de la bonne façon non plus.
Code:
1
2
|
<agm-marker *ngFor="let marker of markers" [latitude]="marker.latitude" [longitude]="marker.longitude"></agm-marker> |
Je me doute que ça doit être une erreur de débutant.
Je vous remercie d'avance et j'espère avoir été assez précis et clair pour en venir à bout ! :D
