【问题标题】:can't add a collection in firebase fireStore无法在 firebase fireStore 中添加集合
【发布时间】:2021-12-21 06:51:02
【问题描述】:

我正在尝试在 fireBase fireStore 中添加一个集合,所以我使用了这个函数 .collection.(doc).set ;集合没有创建,控制台显示错误注册,尽管我在 firebase 的身份验证中找到了新用户,但我希望我能找到好的解决方案。我快疯了

  <div class="uk-position-small uk-position-center uk-overlay uk-overlay-default">
      <form #f="ngForm"  (ngSubmit)="register(f)">
        <div class="uk-margin">
          <div class="uk-inline">
              <span class="uk-form-icon" uk-icon="icon: happy"></span>
              <input class="uk-input" type="text" name="firstName" #firstName="ngModel" ngModel required>
              <p class="alert alert-danger" *ngIf="firstName.errors?.required && firstName.touched">this input firstName and lastName are required</p>

          </div>
      </div>


      <div class="uk-margin">
        <div class="uk-inline">
<textarea class="uk-input"   cols="28" rows="10" placeholder="bio" name="bio" #bio="ngModel" ngModel bio required></textarea>
<p class="alert alert-danger" *ngIf="bio.errors?.required && bio.touched">this bio isrequired</p>

</div>
    </div>
      <div class="uk-margin">
          <div class="uk-inline">
              <span class="uk-form-icon" uk-icon="mail"></span>
              <input class="uk-input" type="text" name="email" #email="ngModel" ngModel email required>
              <p class="alert alert-danger" *ngIf="email.errors?.required && email.touched">this input email is required</p>

          </div>
      </div>

      <div class="uk-margin">
          <div class="uk-inline">
              <span class="uk-form-icon uk-form-icon-flip" uk-icon="icon: lock"></span>
              <input class="uk-input" type="password" name="password" #password="ngModel" ngModel password required minlength="8">
              <p class="alert alert-danger" *ngIf="password.errors?.required && password.touched">this input password is required</p>
              <p class="alert alert-danger" *ngIf="password.errors?.minlength && password.touched">this input password should +8 caratere</p>
            </div>
      </div>
      <div class="uk-margin">
        <div class="uk-inline">
            <span class="uk-form-icon uk-form-icon-flip" uk-icon="icon: lock"></span>
            <input class="uk-input" type="password" name="confirmPassword" #confirmPassword="ngModel" ngModel required minlength="8">
            <p class="alert alert-danger" *ngIf="confirmPassword.errors?.required && password.errors?.minlength && confirmPassword.touched">this input confirmpassword is required</p>
            <p class="alert alert-danger" *ngIf="password.value!==confirmPassword.value && password.touched">not equal</p>
        </div>
    </div>
     <button type="submit" class="btn btn-success">Register</button>

    </form>
    </div>


        export class RegisterComponent implements OnInit {

          constructor(private as:AuthService , private fs:AngularFirestore , private route:Router) { }

  ngOnInit(): void {
  }
  register(f){
   // console.log(f.value)

   let data=f.value
    this.as.signUp(data.email,data.password ).then((user)=>{

    this.fs.collection("users").doc(user.user.uid).set({
  firstName:data.firstName,
  email:data.email,
  bio:data.bio,
  uid:data.user.user.uid
})
.then(()=>{
 console.log('done')
 // this.route.navigateByUrl('/home')
})
})
.catch(()=>{
console.log('error register')
    })
  }

}


@Injectable({
  providedIn: 'root'
})
export class AuthService {

  user: Observable<firebase.User>;

  constructor(private fa:AngularFireAuth) {
    this.user=this.fa.user
   }
  signUp(email,password){
 return this.fa.createUserWithEmailAndPassword(email,password)
  }
  signIn(email,password){
    return this.fa.signInWithEmailAndPassword(email,password)
  }

}

【问题讨论】:

  • 尝试记录错误并在此处发布错误。
  • 错误注册,只是控制台的错误,但奇怪的是我在认证中发现新用户,我的功能有问题吗?
  • 也许我应该在 Firestore 中更改安全规则中的某些内容??
  • 这不是我的意思。将 catch 更改为 catch(e =&gt; console.log(e)) 以便您可以查看错误详细信息。
  • 无法在 Object.onInvoke (core.js:28680) 处的 ZoneDelegate.invoke (zone.js:372) 处的 register.component.ts:28 处读取未定义的属性(读取“用户”) ZoneDelegate.invoke (zone.js:371) 在 Zone.run (zone.js:134) 在 zone.js:1276 在 ZoneDelegate.invokeTask (zone.js:406) 在 Object.onInvokeTask (core.js:28667) 在Zone.runTask (zone.js:178) 处的 ZoneDelegate.invokeTask (zone.js:405)

标签: javascript angular firebase google-cloud-firestore


【解决方案1】:

你没有在你的链中返回承诺,所以你的代码正被它们吹走。如果这不能解决您的问题,那么问题出在您的 signUp 代码中,您必须发布该代码以获得更多帮助。

register(f){
  let data=f.value
  this.as.signUp(data.email, data.password).then((user) => {
    // You need to return this promise. Right now, your code
    // is blowing right by it and immediately calling the next `then`
    return this.fs.collection("users").doc(user.user.uid).set({
      firstName: data.firstName,
      email: data.email,
      bio: data.bio,
      uid: data.user.user.uid
    })
  }).then(() => {
    // This code block has now waited for the doc to be set
    console.log('done')
    // this.route.navigateByUrl('/home')
  }).catch((error) => {
    console.log('error register')
    console.log(error)
  })
}

【讨论】:

  • 你怎么打电话给register(f)?您的注册看起来不错,但我仍然相信您在某处缺少承诺链,这就是注册代码有效但创建集合无效的原因。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-05-07
  • 2021-11-30
  • 2021-11-14
  • 1970-01-01
  • 1970-01-01
  • 2022-06-10
相关资源
最近更新 更多