Javascript 消息传递组件非常慢

我有一个消息组件，可以与系统中的其他用户一起编写消息。问题是，当我打开组件时，站点会变得非常慢，在加载消息之前需要15秒。我可以在代码中做些什么不同的事情来让它正常工作

allMessages() {
    return this.messages.concat(this.uploadingMessages);
}

*ngIf=“m.sender.profileImageUrl===null”>

angular DOM中的所有事件都将被刷新，因此此处将重复调用allMessages（），因此在NgOnInit（）中执行此操作时，请指定一个变量，如下所示

ngOnInit(){
 this.allMesage = this.messages.concat(this.uploadingMessages);
}

<ng-container #messageList *ngFor="let m of allMessage | async; let i = index; trackBy: trackByMessageId">

ngOnInit(){
apiCall.subscribe(data=>{
 this.allMesage = data.messages.concat(data.uploadingMessages);
},
error=>{
console.log(error)
})

并在component.html中修改代码，如下所示

<ng-container #messageList *ngFor="let m of allMessage; let i = index; trackBy: trackByMessageId">

---

在angular DOM中，所有事件都将被刷新，因此此处将重复调用allMessages（），因此在NgOnInit（）中的此操作将分配给一个变量，如下所示

ngOnInit(){
 this.allMesage = this.messages.concat(this.uploadingMessages);
}

<ng-container #messageList *ngFor="let m of allMessage | async; let i = index; trackBy: trackByMessageId">

ngOnInit(){
apiCall.subscribe(data=>{
 this.allMesage = data.messages.concat(data.uploadingMessages);
},
error=>{
console.log(error)
})

并在component.html中修改代码，如下所示

<ng-container #messageList *ngFor="let m of allMessage; let i = index; trackBy: trackByMessageId">

---

请用正确的标记更新您的问题。标记似乎有一些问题。另外，如果可能的话，请与我们分享一些示例数据。我清楚地看到，其中一个原因是您在

*ngIf

中调用

allMessages（）

，该函数将在每个更改检测周期调用该函数。是的，不要在您的角度模板中调用类似的方法。获取组件中的数据，将其存储在变量中，然后在模板中使用该变量。请使用正确的标记更新问题。标记似乎有一些问题。另外，如果可能的话，请与我们分享一些示例数据。我清楚地看到，其中一个原因是您在

*ngIf

中调用

allMessages（）

，该函数将在每个更改检测周期调用该函数。是的，不要在您的角度模板中调用类似的方法。在组件中获取数据，将其存储在变量中，并在模板中使用该变量。我建议还提及

*ngIf

。添加ngIf取决于数据的填充位置？是@cerbus，你的权利，应该删除ngif中的调用方法，也可以使用varibale名称。我已经更改了代码，正如您所说的ajaykumpar mp，但现在我的消息根本没有出现，并且我在控制台中没有收到任何错误。我的代码现在看起来像：this.allMesage=this.messages.concat（this.uploadingMessages）；HTML：然后我将所有函数调用改为“m”。您是如何获取消息的，这是api调用吗？我建议还提及

*ngIf

。添加ngIf取决于数据的填充位置？是@cerbus您的权利，应该删除ngif中的调用方法，也可以使用varibale名称。我已经更改了代码，正如您所说的ajaykumpar mp，但现在我的消息根本没有出现，并且我在控制台中没有收到任何错误。我的代码现在看起来像：this.allMesage=this.messages.concat（this.uploadingMessages）；HTML：然后我将所有函数调用改为“m”。你是如何获取消息的，这是api调用吗？