如何使用Angular Firestore创建并更新子集合？

Hey there! 👋 看你已经成功在Firestore里创建了Person集合，还能通过代码操作文档和字段，接下来要搞子集合的创建和更新是吧？我来给你一步步拆解怎么做~

子集合是依附于父文档存在的，比如我们可以给每个Person文档添加一个contacts子集合，用来存储该用户的联系人信息。

假设你已经有一个Contact接口（就像你定义的Person一样）：

interface Contact {
  name: string;
  phone: string;
  email?: string;
}

接下来在组件里写一个方法，给指定的Person文档创建子集合并添加文档：

// 注入AngularFirestore实例，和你现有代码里的afs一致
constructor(private afs: AngularFirestore) {}

// 给指定ID的Person添加联系人（创建子集合文档）
addContactToPerson(personId: string, contact: Contact) {
  // 路径：person/{personId}/contacts
  const contactsCol = this.afs.collection('person').doc(personId).collection('contacts');
  // 添加新文档，Firestore会自动生成文档ID
  return contactsCol.add(contact);
}

调用这个方法的时候，只需要传入目标Person的ID和联系人数据就行啦，比如：

this.addContactToPerson('abc123', { name: 'John Doe', phone: '1234567890' })
  .then(() => console.log('联系人添加成功！'))
  .catch(err => console.error('添加失败：', err));

如果想自定义子集合文档的ID，不用add()，改用doc(自定义ID).set(数据)就行：

contactsCol.doc('custom-contact-id').set(contact);

更新子集合里的文档也很简单，核心就是先定位到父文档，再找到子集合里的目标文档，然后调用update()或者set()方法：

部分更新（只改需要修改的字段） #

用update()方法，只会更新你传入的字段，其他字段保持不变：

updateContact(personId: string, contactId: string, updatedData: Partial<Contact>) {
  return this.afs.collection('person')
    .doc(personId)
    .collection('contacts')
    .doc(contactId)
    .update(updatedData);
}

// 调用示例：更新某个联系人的电话
this.updateContact('abc123', 'custom-contact-id', { phone: '0987654321' });

全量覆盖（替换整个文档） #

如果想用新数据完全替换旧文档，用set()方法，记得加上{ merge: true }参数，这样如果文档不存在会自动创建，存在的话就合并数据（不加的话会直接覆盖所有字段）：

replaceContact(personId: string, contactId: string, newContactData: Contact) {
  return this.afs.collection('person')
    .doc(personId)
    .collection('contacts')
    .doc(contactId)
    .set(newContactData, { merge: true });
}

和你监听Person集合的方式类似，你也可以监听子集合的变化，拿到带ID的数据：

getPersonContacts(personId: string) {
  const contactsCol = this.afs.collection('person').doc(personId).collection('contacts');
  return contactsCol.snapshotChanges().map(actions => {
    return actions.map(a => {
      const data = a.payload.doc.data() as Contact;
      const id = a.payload.doc.id;
      return { id, ...data };
    });
  });
}

// 在组件里订阅数据
ngOnInit() {
  this.contacts$ = this.getPersonContacts('abc123');
}

这样你就能轻松操作Firestore的子集合啦，有问题随时问~

内容的提问来源于stack exchange，提问作者Maria Work