Javascript 如何将Firebase云存储中返回的项目的URL推送到Angular中的数组中？

目标：
目标是使用

listAll（）

返回存储在Firebase存储桶中的图像，然后使用

getDownloadURL（）

获取它们的URL，并将每个URL推送到一个数组中，该数组将用于在库中显示图像

问题：
我成功地返回了URL，但当我尝试将URL推送到空数组时，出现以下错误：

TypeError:“\u这是未定义的”

我所做的：
在过去的3天里，我尝试了几种方法，这是我能想到的最好的方法：

声明空数组：

导出类imgService{

公共图像=[]

方法：

我对这一切都是新手，只是想学习网络技术，所以请对我放松点。

---

谢谢

看来问题在于理解js中的“this”是如何工作的。 如图所示，有两种方法可以解决您面临的问题

首先要确定问题：

在大多数情况下，它的值是由函数的调用方式（运行时绑定）决定的。它不能在执行过程中通过赋值进行设置，每次调用函数时它可能会有所不同

在当前上下文中，通过定义一个常规函数来处理

listAll（）。然后

和

result.items.forEach，您将丢失对所需“this”的引用

然后看看可能的解决方案：

ES5引入了bind（）方法来设置函数的this值
不管它是如何调用的，ES2015引入了箭头函数
它们不提供自己的此绑定（它保留此值
包含的词汇上下文）

因此，我们可以明确说明“this”的意思，或者通过使用将其全部传递下去。我个人的偏好是在这种情况下使用箭头符号，因此下面的代码应该可以工作

希望这能解决您的问题，并帮助您了解潜在的问题是什么

//creating a reference
var itemsRef = firebase.storage().ref().child('images/');
// listing the images
itemsRef.listAll().then((result) => {
    result.items.forEach((itemRef) => {
        // getting the URLs of the images
        itemRef.getDownloadURL().then(downloadURL => {
            console.log('URL:' + downloadURL);
            // pushing URLs to the empty images array
            this.images.push(downloadURL); //PROBLEM OCCURS HERE
        }).catch(function (error) {
            //Handling error here
        });
    });
}).catch(function (error) {
    //Handling error here
});

看来问题在于理解js中的“this”是如何工作的。
如图所示，有两种方法可以解决您面临的问题

首先要确定问题：

在大多数情况下，它的值是由函数的调用方式（运行时绑定）决定的。它不能在执行过程中通过赋值进行设置，每次调用函数时它可能会有所不同

在当前上下文中，通过定义一个常规函数来处理
listAll（）。然后
和
result.items.forEach，您将丢失对所需“this”的引用

然后看看可能的解决方案：

ES5引入了bind（）方法来设置函数的this值
不管它是如何调用的，ES2015引入了箭头函数
它们不提供自己的此绑定（它保留此值
包含的词汇上下文）

因此，我们可以明确说明“this”的意思，或者通过使用将其全部传递下去。我个人的偏好是在这种情况下使用箭头符号，因此下面的代码应该可以工作

希望这能解决您的问题，并帮助您了解潜在的问题是什么

//creating a reference
var itemsRef = firebase.storage().ref().child('images/');
// listing the images
itemsRef.listAll().then((result) => {
    result.items.forEach((itemRef) => {
        // getting the URLs of the images
        itemRef.getDownloadURL().then(downloadURL => {
            console.log('URL:' + downloadURL);
            // pushing URLs to the empty images array
            this.images.push(downloadURL); //PROBLEM OCCURS HERE
        }).catch(function (error) {
            //Handling error here
        });
    });
}).catch(function (error) {
    //Handling error here
});