AngularFire2错误'；无法读取属性'；

我正在使用的Angular4应用程序在标题中显示当前播放的歌曲。为此，我使用了一个在播放列表服务中可以观察到的firbase，并将生成的“noePlaying”对象返回到OnInit的header组件，此时它被订阅并存储在该组件中。我正在视图中显示结果，但即使它正在显示，我的控制台仍显示一个错误： 无法读取未定义的属性“title”： TypeError:无法读取未定义的属性“title” -错误指向MyHeader组件中的OnInit函数。 -当我使用play（）函数时，会出现类似的错误，该函数会更改正在播放的歌曲 “用户回调引发异常。TypeError:无法读取未定义的属性“$key”

有人能帮我弄清楚吗？该应用程序似乎正常运行，但错误表明我一定做了一些不正确的事情。非常感谢。下面是播放列表服务、标题组件TS和标题组件HTML的代码

播放列表服务

从'@angular/core'导入{Injectable}；
从“/Song.model”导入{Song}；
从“angularfire2/database”导入{AngularFireDatabase，FirebaseListObservable，FirebaseObjectObservable}；
从'rxjs/Subject'导入{Subject}；
从'rxjs/Rx'导入{Observable}；
进口“rxjs/Rx”；
从“firebase/app”导入*作为firebase；
@可注射（）
导出类播放服务{
用户：可观察；
歌曲：FirebaseListObservable；
大小主题：主题；
正在播放：FirebaseListObservable；
np：任何；
npKey：任何；
构造函数（私有数据库：AngularFireDatabase，公共afAuth:AngularFireAuth）{}；
getSongs（）{
this.songs=this.db.list（“/songs”{
查询：{
orderByChild:“喜欢”，
}
}
).map（（数组）=>array.reverse（））作为FirebaseListObservable；
归还这首歌；
}
getNowPlaying（）{
this.nowPlaying=this.db.list（“/songs”{
查询：{
orderByChild:“玩”，
等额：1
}
})可以观察到
将此返回。正在播放；
}
播放（nextSongKey、currentSongKey）{
this.songs.update（currentSongKey，{play:0}）；
this.songs.update（nextSongKey，{play:1}）；
//console.log（nextSongKey的类型）；
//console.log（currentSongKey的类型）；
}
停止（id）{
this.songs.update（id，{play:0}）；
}
}

尝试

{{{nowPlaying？.title}}

和所有其他具有属性路径的对象。这似乎是一个异步问题。正如@AJT_82提到的，这是一个

async

问题。当您将

title

分配给

this.npTitle

时，

nowPlaying

尚未解析。为什么不直接在订阅中分配它呢？例如，

this.npTitle=nowPlaying[0]['title']@AJT\U 82谢谢！你的解决方案非常有效。但是，play函数似乎仍然显示错误。它说“TypeError:无法读取未定义的属性'set'”和“警告：用户回调引发了异常。TypeError:无法读取未定义的属性'$key'”当我第一次单击该函数时，该函数根本不工作，但是当我第二次点击它时，它就开始工作了，从那时起。。。我认为我不能在TS函数中添加问号，所以我应该怎么做？谢谢@谢谢你！。我阅读了你的链接并实施了你的建议。（上面的代码经过编辑以显示更改）但是，我仍然在播放功能中遇到错误。”无法读取undefined的属性“$key”，它第一次起作用，但当我再次单击它时，下一首歌将播放，但上一首歌不会停止，因此看起来它们都在播放。。。可能是因为currentSongKey值尚未更新，即使我在组件中订阅了它！怎么回事？没问题，搞定了！如果有帮助，您可以查看早期版本的live at。这是一个显示播放列表的应用程序，让人们投票决定下一步播放哪些歌曲。我正在使用的是一个管理组件，我可以在其中播放歌曲（通过设置song.play=1），同时停止上一首歌曲（设置song.play=0）。在html中的一个图标上激活播放函数（单击），然后组件从服务调用该函数，将当前播放歌曲的$key和要播放的新歌的key（id）作为aguments传递（单击的那一首）。请尝试
{{nowPlaying？.title}
以及所有其他具有属性路径的对象。这似乎是一个异步问题。正如@AJT_82提到的，这是一个
async
问题。当您将
title
分配给
this.npTitle
时，
nowPlaying
尚未解析。为什么不直接在订阅中分配它呢？例如，
this.npTitle=nowPlaying[0]['title']@AJT\U 82谢谢！你的解决方案非常有效。但是，play函数似乎仍然显示错误。它说“TypeError:无法读取未定义的属性'set'”和“警告：用户回调引发了异常。TypeError:无法读取未定义的属性'$key'”当我第一次单击该函数时，该函数根本不工作，但是当我第二次点击它时，它就开始工作了，从那时起。。。我认为我不能在TS函数中添加问号，所以我应该怎么做？谢谢@谢谢你！。我阅读了你的链接并实施了你的建议。（上面的代码经过编辑以显示更改）但是，我仍然在播放功能中遇到错误。”无法读取undefined的属性“$key”，它第一次起作用，但当我再次单击它时，下一首歌将播放，但上一首歌不会停止，因此看起来它们都在播放。。。可能是因为currentSongKey值尚未更新，即使我在组件中订阅了它！怎么回事？没问题，搞定了！如果有帮助，您可以查看早期版本的live at。这是一个显示播放列表的应用程序，让人们投票决定下一步播放哪些歌曲。我正在使用的是一个管理组件，我可以在其中播放歌曲（通过设置song.play=1）