javascript - Angular 7 分量

Question

我需要将一个名为“photos”的数组从我的 component.ts 传递到 component.html。这是我的 component.ts 文件

export class PhotosComponent implements OnInit {
public photos:any[]
constructor(){}
ngOnInit(){

 S3.listObjects({Delimiter: '/'}, function(err, data) {

  var albumName
if (err) {
  return alert('There was an error listing your albums: ' + err.message);
} else {
    console.log(data.CommonPrefixes)

  var albums = data.CommonPrefixes.map(function(commonPrefix) {
   //   console.log(albums)
    var prefix = commonPrefix.Prefix;
    console.log(prefix)
    albumName = decodeURIComponent(prefix.replace('/', ''));
    console.log(albumName)
    this.photos.push(albumName)
  });

  }


});
console.log(this.photos)

}

在 this.photos.push(albumName) 行，它显示“无法读取未定义的属性‘照片’”此外，我无法将数据传递到 html。任何帮助将不胜感激。提前致谢

Answer 1

您的 this 具有不同的作用域，因为您处于回调函数中。解决此问题的最简单方法是使用 arrow functions相反。

将 function(err, data) 更改为 (err, data) => 并将 function(commonPrefix) 更改为 (commonPrefix ) =>.

另一个(旧的)解决方案是将 this 绑定(bind)到函数或将 this 存储在不同的局部变量中。