2017-12-18 18 views
0

Angular4 및 angularfire2-Firestore가있는 ionic3 앱을 실행 중입니다.특정 인덱스에서 관찰 할 수있는 배열 요소 가져 오기 [Typescript]

Observable에서 단일 개체를 얻는 방법은 무엇입니까? 나는 타이프 스크립트로 돌아 오기를 기대하고있다.

console.log(this.opportunity.title) // "Title1" 

아래 코드에서 index와 매개 변수로 getOpportunityByIndex() 메소드를 사용하고 있습니다. 나는 다음과 같은 결과를 얻고 있으며 다음에 무엇을해야할지 모르겠습니다. 나는 당신의 예를 this.opportunities의 이해가 무엇에서

Observable {_isScalar: false, source: Observable, operator: MapOperator} 
    operator:MapOperator {thisArg: undefined, project: ƒ} 
    source:Observable {_isScalar: false, source: Observable, operator: MapOperator} 
    _isScalar:false 
    __proto__:Object 

코드

export interface Opportunity { title: string; } 
export interface OpportunityId extends Opportunity { id: string; } 

opportunities: Observable<OpportunityId[]>; 

    constructor(public firebaseProvider: FirebaseProvider) { 
    this.opportunities = this.firebaseProvider.getOpportunities(); 
    } 

    getOpportunityByIndex(index: number) {    
    this.opportunity = this.opportunities.map(arr => arr[index]); 
    console.log(this.opportunity.title); 
    } 
} 

FirebaseProviderService

import { Injectable } from '@angular/core'; 
import { AngularFirestore, AngularFirestoreCollection } from 'angularfire2/firestore'; 
import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/operator/map'; 

export interface Opportunity { title: string; } 
export interface OpportunityId extends Opportunity { id?: string; } 

@Injectable() 
    export class FirebaseProvider {  
    private opportunitiesCollection: AngularFirestoreCollection<OpportunityId>; 
    opportunity: Opportunity 

    constructor(afs: AngularFirestore) { 
    this.opportunitiesCollection = afs.collection<Opportunity>('opportunities'); 
    this.opportunities = this.opportunitiesCollection.snapshotChanges().map(actions => { 
     return actions.map(a => { 
     const data = a.payload.doc.data() as Opportunity; 
     const id = a.payload.doc.id; 
     return { id, ...data }; 
     }); 
    }); 
    } 

    getOpportunities() { 
    return this.opportunities; 
    } 
} 

답변

0

기회의 배열과 관찰을 반환합니다. 이렇게하면 스트림을 구독하기 만하면 매개 변수로 전달 된 특정 인덱스를 선택할 수 있습니다. 이것은 당신이해야 할 것입니다 : 당신이 좀 더 유연한 정기적 배열 기회의 목록을 만들 수 있습니다 확인하려면

getOpportunityByIndex(index: number) {    
this.opportunities 
.subscribe(opportunities => { 
    this.opportunity = opportunities[index]; 
    console.log(this.opportunity.title); 
    }); 

} 

편집

opportunities: OpportunityId[] 

및 그런 다음 생성자에서 수행하십시오.

}

다음

당신이 그것을 호출 할 때마다 간단하게 할 수는

getOpportunityByIndex(index: number) {    
    this.opportunity = this.opportunities[index]; 
    console.log(this.opportunity.title); 
} 
+0

당신이 올바른지,이 방법은 내가 방법 언제든지 실행할 경우 그러나 나는 opportunity.title을 반환 할 수 없습니다, 생성자에서 큰 실행하는 것 클릭 이벤트와 같이 앱이로드 된 후 – jchri853

+0

좀 더 유연하고 자신의 사례 시나리오를 고려하여 내 대답을 편집했습니다. –

+0

멋진! 고마워요. Hugo Noro – jchri853