Angular 获取特定索引处可观测的数组元素[Typescript]

我正在运行一个带有Angular4和angularfire2 Firestore的ionic3应用程序

一个人如何从一个可观察的物体中获得一个物体。我期待着返回在打字脚本

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

在下面的代码中，我使用了以index为参数的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

代码

导出接口机会{title:string；}
导出接口OpportunityId扩展了Opportunity{id:string；}
机会：可见；
构造函数（公共firebaseProvider:firebaseProvider）{
this.opportunities=this.firebaseProvider.getOpportunities（）；
}
getOpportunityByIndex（索引：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;
  }
}

从'@angular/core'导入{Injectable}；
从“angularfire2/firestore”导入{AngularFirestore，AngularFirestoreCollection}；
从“rxjs/Observable”导入{Observable}；
导入'rxjs/add/operator/map'；
导出接口机会{title:string；}
导出接口OpportunityId扩展了Opportunity{id？：string；}
@可注射（）
导出类FirebaseProvider{
私人机会收藏：AngularFirestoreCollection；
机遇：机遇
建造商（afs:AngularFirestore）{
this.opportunities collection=afs.collection（'opportunities'）；
this.opportunities=this.opportunities集合.snapshotChanges（）.map（操作=>{
返回actions.map（a=>{
const data=a.payload.doc.data（）作为Opportunity；
const id=a.payload.doc.id；
返回{id，…data}；
});
});
}
getOpportunities（）{
把这个机会还给我；
}
}

根据我对您的示例的理解，

这个。opportunities

返回一个带有Opportunity数组的可观察值。有了它，您只需要订阅流，然后就可以选择参数传递的特定索引。这是您需要做的：

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);
}

---

你是正确的，这个方法在构造函数中运行得很好，但是如果我在App被加载后的任何时候都运行这个方法，比如点击事件，我就不能返回机会。我已经编辑了我的答案，让它更灵活，考虑你的情况。非常感谢雨果·诺罗总是很乐意帮忙：）

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