我正在嘗試為存盤在 Firestore 實體中的離子串列中的離子專案實作洗掉功能。我試圖用該.splice()函式解決它，但這會引發以下錯誤：
'Observable<any[]>'.ts(2339) 型別上不存在屬性“拼接”
任何人都知道如何解決這個問題？
代碼如下所示：
HTML
<ion-item-sliding *ngFor="let space of spaces | async; let i = index">
<ion-item>
<ion-icon name="ellipse-outline"></ion-icon>
<ion-label>
{{ space.spaceName }}
</ion-label>
</ion-item>
<ion-item-options (ionSwipe)="deleteSpace(i)">
<ion-item-option color="success" (click)="editspacenameModal()">
Edit
</ion-item-option>
<ion-item-option color="danger" (click)="deleteSpace(i)" expandable>
Delete
</ion-item-option>
</ion-item-options>
</ion-item-sliding>
TS
export class ActivitiesPage implements OnInit {
spaces: Observable<any[]>;
...
deleteSpace(i) {
this.spaces.splice(i,1);
console.log('deleteSpace() called')
}
uj5u.com熱心網友回復：
您需要過濾實際的陣列，而不是圍繞它的可觀察物件。因此，您將把 Observable 的內容（它是一個 any[]）映射到一個被過濾的spaces.
deleteSpace(i) {
this.spaces = this.spaces.pipe(
map(result => result.filter((r, index) => i !== index))
)
console.log('deleteSpace() called')
this.spaces.subscribe((out) => console.log(out))
}
使用filter內部map運算子將解決您的問題。
uj5u.com熱心網友回復：
一種方法是轉換您的 observable 并將其過濾掉：
在此處閱讀更多資訊：
https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
const data = this.yourdata.filter(item => item.property !== desiredvalue)
您還可以檢測串列中的更改并直接過濾 observable。
在此處閱讀更多資訊：
https://www.learnrxjs.io/learn-rxjs/operators/filtering/filter
也許這個問題對你有幫助：
如何過濾一個 Observable 陣列？
uj5u.com熱心網友回復：
這是我解決它的方法：
HTML
<ion-item-sliding *ngFor="let space of spaces | async">
<ion-item detail>
<ion-icon name="ellipse-outline" start></ion-icon>
<ion-label>
{{ space.spaceName }}
</ion-label>
</ion-item>
<ion-item-options (ionSwipe)="deleteSpace(space)">
<ion-item-option color="success" (click)="editspaceModal(space)"> Edit </ion-item-option>
<ion-item-option color="danger" (click)="deleteSpace(space)" expandable> Delete </ion-item-option>
</ion-item-options>
</ion-item-sliding>
TS
deleteSpace(space: Space): void {
console.log('space.id',space)
this.setisDeleted(space);
}
setisDeleted(space): Promise<any> {
const isDeleted = true;
return this.angularFirestore
.collection('accounts')
.doc(this.userId)
.collection("spaces")
.doc(space.spaceId)
.update({ isDeleted })
}v
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/380226.html
標籤：有角的 打字稿 离子框架 谷歌云firestore rxjs