承诺返回数据不能分配给类变量？

Question

我正在尝试将承诺返回值分配给一个变量，但它没有分配。当我 console.log(this.imageref1) 时，我仍然得到空字符串。 这里的目标是获取将照片上传到 Firebase 后返回的 data.downloadURL。我需要下载的URL。将其存储在我的数据库中作为图像路径。我被困在这里，我的数据库为 downloadURL 获取了空数据。

post_news(form: NgForm){

    this.title = form.value.title;
    this.content = form.value.content;
    this.category = form.value.category;


    console.log(this.capturedimage1);


    if(this.capturedimage1 !== ''){

        //console.log('captured image is not empty');



    let storageRef = firebase.storage().ref();

    const filename = Math.floor(Date.now() / 1000);

    const imageRef = storageRef.child(`images/${filename}.jpg`);

    let uploaded_file_path = `images/${filename}.jpg`;      


    imageRef.putString(this.capturedimage1, firebase.storage.StringFormat.DATA_URL).then(data=>{

        this.imageref1 = data.downloadURL;

    });


    } 
}

Answer 1

var that = this;
imageRef.putString(this.capturedimage1, firebase.storage.StringFormat.DATA_URL)
.then(data=>{      
    that.imageref1 = data.downloadURL;
    return Promise.resolve(data.downloadURL);
})
.then(function(url){
    //make the db call.
});

Answer 2

所以这个值正在被设定——最终。可能您正在为它在封闭函数执行完成后发生的事实而苦苦挣扎。例如，这是一个非常简单的测试用例：

function test(x) { 
  x.a = 1;
  Promise.resolve(true).then(_ => x.b = 2); 
  console.log(x);
}

操作，

> test({c: 3})
{ c: 3, a: 1 }
undefined

记录一个还没有b: 2 的对象，然后返回undefined。当然，最终会设置该参数：

> test(abc = {c: 3})
{ c: 3, a: 1 }
undefined
> abc
{ c: 3, a: 1, b: 2 }

要了解真正发生的事情，您需要了解所有 JS 都发生在“事件循环”中。 JavaScript 一次只允许一件事发生，所以当你安排其他事件发生时，JS 必须遵循规则，“先做这个函数中的所有事情，然后再找到安排发生的其他事情。”

一些函数调用同步发生，它们阻止函数调用向前移动直到它们完成。例如，[1,2,3].forEach(x => console.log('hello, ' + x)) 将在完成之前将 3 个字符串记录到控制台。但是 promised 值的全部意义在于计算机正忙于计算它，它还不可用。因此，您只能在发现该值后才能实际使用它，并且您对 promise 的所有操作，包括向 .then() 或 .catch() 添加侦听器，都是异步 或非阻塞。当前函数完成，这些回调被放入事件循环中，只要承诺的计算完成时就会发生。