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 绑定到函数或将this 存储在不同的局部变量中。