Угловой / Firestore — Установите реактивную форму в нетронутое состояние после сохранения документа

# #javascript #angular #google-cloud-firestore

Вопрос:

У моего компонента есть форма. Мои службы обрабатывают запросы, сохраняют и удаляют. При редактировании формы компонент имеет функцию сохранения формы, которая вызывает службу для сохранения данных. Это прекрасно работает. Однако при сохранении я хотел бы отметить форму как нетронутую. Я не верю, что моя попытка верна, так как set строка в сервисе может быть удалена, и форма все равно будет отмечена как нетронутая при сохранении.

Компонент

 async saveForm(){
  await this.service.saveForm(form.value);
  this.form.markAsPristine();
}
 

Обслуживание

 public async saveForm(value: Form) {
  this.afs.doc<Form>(`path`).set(formValue, {merge: true })
}
 

Ответ №1:

попробуйте использовать цепочку обещаний из вашего сервиса и компонента

Обслуживание:

   public async saveForm(Form) {
        this.afs.doc<any>(`path`).set(formValue, {merge: true }).then((result)=>{
          return result
    
        })
 

компонент:

 this.yourservice.saveForm(form.value).then((result)=>{
      if(result){
        this.form.reset();
      }

    })
 

это цепочка обещаний — после рассмотрения этого вопроса с задавшим вопрос ответ изменился на сброс формы.

Комментарии:

1. Спасибо @Chris — Я получаю ошибку в операторе компонента if: «Выражение типа ‘void’ не может быть проверено на истинность»

2. он делает то, что должен делать, попробуйте это.форма?.markAsPristine() или попробуйте установить имя поля, которое вы пытаетесь пометить как нетронутое, а не всю форму. this.form.get(‘ВАШЕ ИМЯ ПОЛЯ’)? .Маркаспристин({только сам: истинно}) angular.io/api/forms/AbstractControl#markAsPristine

3. Спасибо, Крис. К сожалению, это не сработало. Ошибка не в исходной строке, она в » если(результат) {«- «результат» является ошибкой выше. Если это поможет.

4. удалите «если» тогда и результат и просто пообещайте связать это. yourservice.saveForm(форма.значение). тогда(()=>{ this.form.markAsPristine(); })

5. Спасибо за быстрый ответ. Я также пробовал это перед моей первой попыткой. Я могу закомментировать this.afs сегмент в сервисе так, чтобы это была пустая функция, нажать «Сохранить», и форма все равно вернется в исходное состояние, что наводит меня на мысль, что она неправильно связана с результатом записи базы данных.