[AngularJS] Get a list of values with Http.get and ngFor angular cli 2/4?

[Avi Tannenbaum]

Hey everyone.

Im trying to create a datalist and fill it in the template html with the 
data i get from the http.get.

I have no problem retrieving an object from the json with 
JSON.stringify(OBJECT.singleNonRepetitiveProperty) but when the json file 
has multiple objects with the same property name but different values i.e 
singleNonRepetitiveProperty: {"id":1, "id":2, "id":3}  so retrieving a list 
of the "id" property does not work.

meaning this will work: JSON.stringify(data.singleNonRepetitiveProperty) 
and will return the whole class and when i try JSON.stringify(data. 
singleNonRepetitiveProperty.id) in a combonation with ngFor to present the 
data list. it doesn't work.

Was wondering whats the correct way to go about this in angular 2?

Any suggestions?

my component.html
<div class="WidgetClassCSS">
<h3 class="ClubChooserTitleClass">
Choose a club widget
</h3>
<!--
<div *ngFor="let clubid of listOfChosenClubIds; let i = index">
{{clubid}}
</div>

-->
<div class="ClubChooseInputClass">

<input type ='text' list="clubs"/>
<datalist id="clubs">
<option value="1-Rihana">
<option value="2-R5">
<option value="3-David Gueeta">
</datalist>
</div>
<br>

<div *ngFor="let data of data | async; let i = index">

</div>

{{data}}

<a class="goToClubButtonClass">Go to this club</a>


</div>





my current code component.ts:

// get he info
getInfoPost(){
var headers = new Headers();
headers.append('appkey', 'putappkeyhere');
headers.append('dataType', 'json');
// wall url is over here
var listOfChosenClubIds = this.http.get('https://api.url/webapi/', {
headers:headers})
.map(
res => res.json()).subscribe(
data => this.data = JSON.stringify(data.id));
/*err => this.logError(err),
() => console.log('Arist backgrouns Image Loaded') ); */
;
{}
}



// get the error and log it
logError(err) {
console.error('There was an error: ' + err);
}
// set the initial app code running
ngOnInit() {


this.data = this. getInfoPost();

}


my json:

{ "type": "clubListResponse", "status": { "errorCode": 200, 
"serverTimestamp": 1498853113884 }, "clubs": [ { "adminUserIds": [ 490 ], 
"artistId": 490, "avatarUrl": 
"https://url/490/3E90175B-05DB-428B-ACA7-FE887F013D9C.JPG";, 
"backgroundUrl": 
"https://url/490/3DE051D1-CDF8-4527-A879-C26F7720CF43.JPG";, "banner": "Win 
a Private Home Concert", "description": "Hello", "fanFeedLabel": "Fan 
Feed", "id": 18, "location": { "area": "NY", "country": "United States", 
"latitude": 44.526542918798, "locality": "Chesterfield", "longitude": 
-73.461191011661, "subArea": "Essex" }, "name": "Ariana Grande", "owner": { 
"avatarUrl": "https://url/490/3E90175B-05DB-428B-ACA7-FE887F013D9C.JPG";, 
"backgroundUrl": 
"https://url/490/2009598A-D474-484A-B0A6-A06A2E9EF3A2.JPG";, "id": 490, 
"location": { "area": "NY", "country": "United States", "latitude": 
44.526542918798, "locality": "Chesterfield", "longitude": -73.461191011661, 
"subArea": "Essex" }, "name": "Ari", "notificationSetting": { "artistPost": 
true, "clubs": [], "fanPost": true, "postCommented": true, "postLiked": 
true, "streamPost": true }, "quickBloxId": 5462290, 
"subscriptionExpiration": 0, "totalCoins": 0 }, "splashUrl": 
"https://url/490/7245ADF1-412E-458F-8B3B-1F4B5A64EFD6.JPG";, "stats": { 
"activities": 157, "followers": 193, "payingSubscribers": 2, "subscribers": 
3 }, "streaming": false, "subscriptionProductIds": [ 
"com.w.ios.auto.1month", "com.w.ios.auto.monthly" ], "uploading": false, 
"url": "https://url/490/2009598A-D474-484A-B0A6-A06A2E9EF3A2.JPG"; }, { 
"adminUserIds": [ 264 ], "artistId": 264, "avatarUrl": 
"https://url/264/9B0E27B4-85A1-4C81-BA89-AA8F2634AC45.JPG";, 
"backgroundUrl": 
"https://url/264/276D009C-F818-452E-AEAE-89F1CC20A61D.JPG";, "banner": "WIN 
A SIGNED GUITAR", "description": "Just a regular 15 year old guy from 
Denmark. Check out my club.", "fanFeedLabel": "POST TO ME HERE", "id": 39, 
"location": { "area": "NY", "country": "United States", "latitude": 
40.76395533001, "locality": "New York", "longitude": -73.949299559989, 
"subArea": "New York" }, "name": "Nick Jonas", "owner": { "avatarUrl": 
"https://url/264/9B0E27B4-85A1-4C81-BA89-AA8F2634AC45.JPG";, 
"backgroundUrl": 
"https://url/264/276D009C-F818-452E-AEAE-89F1CC20A61D.JPG";, "id": 264, 
"location": { "area": "NY", "country": "United States", "latitude": 
40.76395533001, "locality": "New York_test_update", "longitude": 
-73.949299559989, "subArea": "New York" }, "name": "Nick Jonas", 
"notificationSetting": { "artistPost": true, "clubs": [], "fanPost": true, 
"postCommented": true, "postLiked": true, "streamPost": true }, 
"quickBloxId": 5299435, "subscriptionExpiration": 1477913870000, 
"totalCoins": 0 }, "splashUrl": 
"https://url/264/276D009C-F818-452E-AEAE-89F1CC20A61D.JPG";, "stats": { 
"activities": 25, "followers": 189, "payingSubscribers": 0, "subscribers": 
1 }, "streaming": false, "subscriptionProductIds": [ 
"com.w.ios.auto.1month", "com.w.ios.auto.monthly" ], "uploading": false, 
"url": "https://url/264/276D009C-F818-452E-AEAE-89F1CC20A61D.JPG"; }, { 
"adminUserIds": [ 3, 275, 276, 277 ], "artistId": 3, "avatarUrl": 
"https://url/3/45512FAF-DD31-4032-A742-7C8ED7A7A2D7.JPG";, "backgroundUrl": 
"https://url/3/B017A4B5-12B2-4817-B486-3881A92EDAD4.JPG";, "banner": "New 
Single - Out Now", "description": "Join my club for behind the scenes 
updates and exiting journeys. Every week you can join my live broadcast and 
meet up on 1-2-1 video chats.", "fanFeedLabel": "Rihanna Fan Comminity", 
"id": 3, "location": { "area": "NY", "country": "United States", 
"latitude": 40.75, "locality": "New York", "longitude": -73.98, "subArea": 
"New York" }, "logoUrl": 
"https://url/3/FB358CBB-EBC6-4B15-A794-27BAACA4D4A1.PNG";, "name": 
"Rihanna", "owner": { "avatarUrl": 
"https://url/3/45512FAF-DD31-4032-A742-7C8ED7A7A2D7.JPG";, "backgroundUrl": 
"https://url/3/B017A4B5-12B2-4817-B486-3881A92EDAD4.JPG";, "id": 3, 
"location": { "area": "CA", "country": "United States", "latitude": 37.8, 
"locality": "San Francisco", "longitude": -122.43, "subArea": "San 
Francisco" }, "name": "Rihanna", "notificationSetting": { "artistPost": 
true, "clubs": [], "fanPost": true, "postCommented": true, "postLiked": 
true, "streamPost": true }, "quickBloxId": 3228502, 
"subscriptionExpiration": 0, "totalCoins": 0 }, "splashUrl": 
"https://url/275/E6CF9742-B175-43F9-A42F-3B3C9F025C86.JPG";, "stats": { 
"activities": 17, "followers": 163, "payingSubscribers": 1, "subscribers": 
3 }, "streaming": false, "subscriptionProductIds": [ 
"com.w.ios.auto.1month", "com.w.ios.auto.monthly" ], "uploading": false, 
"url": "https://url/3/B017A4B5-12B2-4817-B486-3881A92EDAD4.JPG"; }, { 
"adminUserIds": [ 4 ], "artistId": 4, "avatarUrl": 
"https://url/4/D14C5EF2-C28F-4D95-827D-259B3402D0D5.JPG";, "backgroundUrl": 
"https://url/4/798E43CC-725E-4705-9CA2-3B93D66F24C7.JPG";, "banner": "New 
Single - Here it first here", "description": "Join my global journey of 
behind the scenes experiences as DJ.", "fanFeedLabel": "BTS fan community", 
"id": 4, "location": { "area": "NY", "country": "United States", 
"latitude": 40.73, "locality": "New York", "longitude": -73.99, "subArea": 
"New York" }, "name": "BTS", "owner": { "avatarUrl": 
"https://url/4/50302547-4249-42F7-A746-46808F8E007C.PNG";, "backgroundUrl": 
"https://url/4/E065CB77-2ACA-4C1B-8F97-C8274CF1CD66.JPG";, "id": 4, 
"location": { "area": "NY", "country": "United States", "latitude": 40.73, 
"locality": "New York", "longitude": -73.99, "subArea": "New York" }, 
"name": "Jongkook", "notificationSetting": { "artistPost": true, "clubs": 
[], "fanPost": true, "postCommented": true, "postLiked": true, 
"streamPost": true }, "quickBloxId": 3228515, "subscriptionExpiration": 0, 
"totalCoins": 0 }, "splashUrl": 
"https://url/4/059B69A8-3C07-4A21-9C18-34B51A771E24.JPG";, "stats": { 
"activities": 44, "followers": 158, "payingSubscribers": 0, "subscribers": 
3 }, "s

-- 
You received this message because you are subscribed to the Google Groups 
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to angular+unsubscr...@googlegroups.com.
To post to this group, send email to angular@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.