AngularFire2 更新创建新文档字段而不是更新字段

Question

我想用 Angular 6 更新包含配置文件名称和主题标签列表的 Firestore 模型。"name" 存储为文档字段的值，"hashtags" 存储为对象的键。当我尝试更新数据库条目时，每次我调用更新函数而不是更新现有字段时，我的程序都会添加一个名为 "data" 的新文档字段。

我该如何解决这个问题？

这是更新前我的 Firestore 的样子。

我的更新函数添加了一个新的 "data" 字段，而不是每次调用它时都更新。

我的 Firestore 服务：

export class MembersService {
  membersCollection: AngularFirestoreCollection<Member>;
  members$: Observable<Member[]>;
  memberDoc: AngularFirestoreDocument<Member>;

  constructor(public afs: AngularFirestore) {
    this.membersCollection = afs.collection<Member>('Members');
    this.members$ = this.membersCollection.snapshotChanges().pipe(
      map(actions => actions.map(a => {
        const data = a.payload.doc.data() as Member;
        const id = a.payload.doc.id;
        return { data, id };
      }))
    );
  }

   getMembers(): Observable<Member[]> {
     return this.members$;
   }

   updateMember(member: Member) {
    this.memberDoc = this.afs.doc(`Members/${member.id}`);
    this.memberDoc.update(member);
   }
}

我的输入component.ts：

export class MembersComponent implements OnInit {
  members: Member[];
  editState: boolean;
  membertoEdit: Member;

  constructor(private membersService: MembersService) {
    this.editState = false;
   }

  ngOnInit() {
    this.membersService.getMembers().subscribe(members => {
      this.members = members;
    });
  }

  editMember(member: Member) {
    this.editState = true;
    this.membertoEdit = member;
  }

  clearState() {
    this.editState = false;
    this.membertoEdit = null;
  }

  submit(member: Member, editName: string, editHashtag: string) {
    if ( editName !== '' && editHashtag !== '') {
      this.membertoEdit.name = editName;
      const key = editHashtag;
      const object = {};
      object[key] = true;
      this.membertoEdit.hashtag = object;
      this.membersService.updateMember(this.membertoEdit);
    }
    this.clearState();
  }
}

我的component.html 用户输入：

<button *ngIf="editState == false" (click)="editMember(member)">edit</button>

<div *ngIf="editState && membertoEdit.id == member.id">
  <form>
      <input type="text"  #editName>
      <input type="text" #editHashtag>
      <button (click)="submit(member, editName.value, editHashtag.value);
        editName.value=''">Submit</button>
    </form>>
</div>

Answer 1

找到解决办法：连我都觉得不优雅。可以单独传递每个输入

updateMember(member: Member, editName: string, editHashtag: object) {
    this.memberDoc = this.afs.doc(`Members/${member.id}`);
    console.log(this.memberDoc);
    this.memberDoc.update({
      name: editName,
      hashtag: editHashtag
    });
   }

submit(member: Member, editName: string, editHashtag: string) {
    if ( editName !== '' && editHashtag !== '') {
      const key = editHashtag;
      const object = {};
      object[key] = true;
      this.membersService.updateMember(member, editName, object);
    }
    this.clearState();
  }

AngularFire2 更新创建新文档字段而不是更新字段

AngularFire2 update creates new document field instead of updating a field

javascript

typescript

angularfire2

angular

google-cloud-firestore