Question

我正在尝试使用角度将客户端数据和图像添加到火力存储中，我认为发送此操作的3个请求可能是一个很好的经验首先：将客户端数据添加到firestore 第二：将图片上传到Firestore 第三：成功完成上传后，使用图片pah更新客户端的json。

我需要知道我在做什么

我正在尝试如下操作：

首先：将数据添加到Firestore

  addClient(clientObject:client){


    this.db.collection("clients").doc("cient"+clientObject.phone).set(clientObject)
      .then(function() {
        console.log("Document successfully written!");
      })
      .catch(function(error) {
        console.error("Error writing document: ", error);
      });
  }

第二次上传图像，上传完成后，我尝试更新客户端的Json失败，

  makeFileRequest(phonenumber: string, productImg: ElementRef) {
      const mainImageEl: HTMLInputElement = productImg.nativeElement;
      const formData = new FormData();
      const xhr = new XMLHttpRequest();
      if (mainImageEl.files.length > 0) {

       var file = mainImageEl.files.item(0);
        formData.append('image', file, mainImageEl.files.item(0).name);
      }

      // create storage ref
      var storageRef = firebase.storage().ref("clientsIds/"+phonenumber);
      //upload file
        var task = storageRef.put(file);

        task.on('state_changed',

          function progress(snapshot) {

          },

          function error(err) {

          },

          function complete() {
          this.imageUploadisDone=true;
            let fileName:string = storageRef.fullPath+mainImageEl.files.item(0).name;
            let filefulltype = storageRef.fullPath+mainImageEl.files.item(0).type;
            let fileExtintion = filefulltype.substring(filefulltype.length-3,filefulltype.length);
            let fileFullPath:string =fileName;
            console.log("Upload compleated......."+"gs://cowshero.appspot.com/clientsIds/"+fileFullPath);
            this.updateClientImageId(phonenumber,"gs://cowshero.appspot.com/clientsIds/"+fileFullPath);

          }
        );

    }

第三：数据库更新（不起作用）

  updateClientImageId(phoneNumer:string, imagePath:string){

    var clientDoc = this.db.collection("clients").doc("cient"+phoneNumer);

       return clientDoc.update({idImage:imagePath})
         .then(function() {
           console.log("Document successfully updated!");
         })
         .catch(function(error) {
           console.error("Error updating document: ", error);
         });

  }

我在控制台中遇到的错误：

core.js:1440 ERROR Error: Uncaught (in promise): TypeError: this.updateClientImageId is not a function
TypeError: this.updateClientImageId is not a function
    at Observer.complete (clients-service.service.ts:100)
    at eval (index.esm.js:2061)
    at ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:4733)
    at ZoneDelegate.invoke (zone.js:387)
    at Zone.run (zone.js:138)
    at eval (zone.js:858)
    at ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4724)
    at ZoneDelegate.invokeTask (zone.js:420)
    at resolvePromise (zone.js:809)
    at eval (zone.js:861)
    at ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4724)
    at ZoneDelegate.invokeTask (zone.js:420)
    at Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)
    at ZoneTask.invokeTask [as invoke] (zone.js:500)
    at invokeTask (zone.js:1517)
    at XMLHttpRequest.globalZoneAwareCallback (zone.js:1543)

角度和火商店上传图像并将图像URL添加到数据库json

0 个答案: