我正在使用 Angular4 和 angularfire2-Firestore 运行 ionic3 应用程序。
如何从 Observable 获取单个对象。我希望以 typescript 形式返回。
console.log(this.opportunity.title) // "Title1"
在下面的代码中,我使用 getOpportunityByIndex() 方法,并将索引作为参数。我得到以下输出,但我不确定下一步该做什么。
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);
}
}
FirebaseProvider服务
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;
}
}
最佳答案
据我对您的示例的了解,this.opportunities
返回一个包含机会数组的可观察值。有了这个,您只需要订阅流,然后您就可以选择参数传递的特定索引。这是您需要做的:
getOpportunityByIndex(index: number) {
this.opportunities
.subscribe( opportunities => {
this.opportunity = opportunities[index];
console.log(this.opportunity.title);
});
}
编辑
如果您想让它更加灵活,您可以将机会列表设为常规数组
opportunities: OpportunityId[]
然后在构造函数中执行
constructor( public firebaseProvider:FirebaseProvider) {
this.firebaseProvider.getOpportunities()
.subscribe( opportunities => {
this.opportunities = opportunities;
});
}
然后你就可以在任何你想调用它的时候执行
getOpportunityByIndex(index: number) {
this.opportunity = this.opportunities[index];
console.log(this.opportunity.title);
}
关于angular - 获取特定索引处可观察的数组元素 [Typescript],我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47877292/