2017-05-22 7 views
0

私のウェブサイトにイベントを表示したい。角度のあるFacebookのイベントを表示する

私はこれでFacebookのからイベントを取る:

infos.service.ts:home.component.tsで後

getEvents(link: string): Observable<any>{ 

let id = link.split('facebook.com/')[1].split('?')[0]; 
console.log("id ------> ",id); 

return this.http.get(`https://graph.facebook.com/${id}?fields=events{name}&access_token=`)  
    .map(events => events.json()); 
} 

onChange(e: Event) { 

let value = e.target['value']; 
this.service.getEvents(value).subscribe(event => { 
    console.log('events: ', event); 
}) 
    this.service.getEvents(value).subscribe((data) => this.events=data); 

    } 
} 

そして、私は順番にこれを使用表示する:

<ul> 
    <li> {{ events | json}}</li> 
</ul> 

しかしそれは私にそれを示して、私は使用することができない* ngFor:

"events": { "data": [ { "name": "Qui veut partir à Ibiza avec la team Coke TV cet été ?", "id": "1039032149505674" }, { "name": "MoveMyCity #MoveLyon", "id": "891490744279264" }, { "name": "MoveMyCity #MoveToulouse", "id": "816021265181647" }, { "name": "MoveMyCity #MoveMontpellier", "id": "801781889934749" }, { "name": "MoveMyCity #MoveMarseille", "id": "1610198129252793" }, { "name": "MoveMyCity #MoveNantes", "id": "936652956376199" }, { "name": "MoveMyCity #MoveParis", "id": "1609074386008334" } ], "paging": { "cursors": { "before": "QVFIUmdUc21tQW80b0tzLVgtc3VtUHI5OFNxdlZAMaVUwZAW02R1JvbGs4ZAUVwTUpmbUNiSVJ5eTBHVXMwSkw4RkFQQWNzZA3o1eTgzN2hxUFVINnlzd1ZA1eE93", "after": "QVFIUjgtRUUwR29ud25QdlE2YmVhQ3BfZAXdsd1R2SDlqeWlaeEk5empwVlBWQ1VkOXFtUkF2VUVPQlhvMWlLaHdNZA2VXczBuQkpyc0o1V2dNQUdZAYjllVE1B" } } }, "id": "998589190158511" } 

ありがとうurヘルプ。

答えて

0

私はJSONへのステップと、配列を抽出します:コンポーネントのコードは同じとどまる

return this.http.get('the url')  
    .map(events => events.json().events.data); 
} 

、あなたは非常によく、あなたのデータを反復処理することができます

<div *ngFor="let event of events"> 
    {{event.name}} 
</div> 

そうでない場合は配列だけを抽出したいのですが、そのようにコードを保持したい場合は、次のように反復処理する必要があります。

+0

ここでは、 h私はあなたのJSONを想定しているので、これはあなたがユーザーを得る方法です:http://plnkr.co/edit/93XEvi0dKcrjZ3PurB5J?p=preview – Alex

関連する問題