为什么AngularFirestore创建新对象而不是将其视为不可变对象？

我正在从Firebase存储的JSON对象（称为

Page

）创建输入框表

Page

是一个JSON对象，它表示一个表，其中包含行、单元格和单元格内的单元格元素。我从表示表的页面JSON对象加载并创建角度组件，如下所示：

每次页面上输入框中的值更改时，我都会从输入框组件调用一个方法

onBlur

，将该页面保存在Firestore中，如下所示：

inputBlur（e:事件）{
this.celllel.value=this.inputEl.nativeElement.value.trim（）；
var page=this.scService.getCurrPageComp（）.page；
console.log（“page=“+page”）；
this.afs.collection（'pages'）.doc（page.$key）.set（JSON.parse（JSON.stringify（page））；
}

问题是在此之后.afs存储更新的页面对象。整个树

let page of pages | async

返回时就像它们是新对象一样，它会重新构建页面，就像它是新的一样。我不想让它对这些观点有任何影响。我只想让它存储更新的

页面

，而不是像重新加载新对象

页面

一样重新加载它

下面是一个Stackblitz，显示了情况：

---

查看stackblitz上的代码，问题是因为

cxforms.component.ts

中的第28行，特别是这部分：

this.pages=this.pagesCollection.snapshotChanges（）

snapshotChanges（）

是一个侦听器，每当数据库的该部分发生更改时（在本例中是“pages”表，它会在您更新值时更改），它就会将数据的新副本推送到您的客户端，从而刷新您的表。听起来您想对Firestore进行一次性查询以获取页面/表数据，而不是侦听更改或更新的数据

查看，它向您展示了如何使用

.get（）

…对数据进行简单（一次性）查询。。。查看页面上第二个到最后一个示例，标题为“获取集合中的所有文档”。。。复制以下内容供您参考：

db.collection("cities").get().then(function(querySnapshot) {
    querySnapshot.forEach(function(doc) {
        // doc.data() is never undefined for query doc snapshots
        console.log(doc.id, " => ", doc.data());
    });
});

---

您还应该了解ngFor的trackBy功能。你真的想在这里用它。