我不知道为什么,当我与我的文本区域交互时,My_MessagesList每次都是反转的ASC和DESC.

        <div class="chat__messages">
            <div *ngFor="let message of authService._messagesList.reverse()" [@fadeInOut] class="message" [ngClass]="session.User.id == message.Id_Sender ? 'myMsg' : 'otherMsg'">
                <p>{{message.Content}}</p>
                <span>{{message.createdAt | date: "HH:mm"}}</span>
            </div>
            <span class="loader" *ngIf="isLoading"></span>
        </div>
        <div class="chat__send">
            <textarea #textarea (input)="adjustTextareaHeight()" rows="1" [(ngModel)]="_content" (keydown.enter)="sendMessage();$event.preventDefault()" placeholder="Envoyer un message"></textarea>
            <button (click)="sendMessage()"><svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M498.1 5.6c10.1 7 15.4 19.1 13.5 31.2l-64 416c-1.5 9.7-7.4 18.2-16 23s-18.9 5.4-28 1.6L284 427.7l-68.5 74.1c-8.9 9.7-22.9 12.9-35.2 8.1S160 493.2 160 480V396.4c0-4 1.5-7.8 4.2-10.7L331.8 202.8c5.8-6.3 5.6-16-.4-22s-15.7-6.4-22-.7L106 360.8 17.7 316.6C7.1 311.3 .3 300.7 0 288.9s5.9-22.8 16.1-28.7l448-256c10.7-6.1 23.9-5.5 34 1.4z"/></svg></button>
        </div>

编辑:这可以与"authService.MessagesList.Slice().verse()"一起使用,但我现在不知道为什么. 如果有人能给我解释一下

推荐答案

您正在调用Angular 模板中的方法,这对您的更改检测周期来说是非常繁重的,所以我强烈建议不要这样做.就像,真的建议你不要这么做.

现在,它逆转的原因是因为上面的抗议.每次运行更改检测时,它都会执行reverse方法.反转不像Slice或任何返回新数组的东西.Reverse将数组就地翻转并返回对原始数组的引用,这意味着服务中的数组将被翻转.当更改检测背靠背调用该方法5-10次时,您将看到它在您身上来回翻转.这是我建议永远不要在模板中使用方法的主要原因之一.更改检测会反复运行它们几十次,并且会严重影响渲染器的性能.try 为该数组创建一个getter,该数组将在每次检索到值时记录值,您将明白我的意思.

Html相关问答推荐

角|将动态html属性添加到子组件

附加点的列表样式

如何在所有屏幕大小下使带有背景图像的伪元素作为标题的衬底?

如何影响flex项目中的flex-gap收缩顺序和文本换行顺序?

尽管div高度为100%,div中的内容仍会溢出

Angular -表和源映射中未显示的数据错误

`table>;的消失;tbody:nth子级(1)`HTML

如何将多个类名组合到CSS中的一个关键帧

配置了 HTML 视口的 Google Apps 脚本移动网络应用程序无法正确显示

:invalid Select 器的惰性判断

如何在黑暗模式切换中添加图标

带标签 css 的 div 内的中心图标

我真的需要一个容器来让行和列正常工作吗? ( bootstrap 程序 v5)

如何调整边框半径以匹配父边框半径

CSS 字母间距将按钮向右扩展

如何使我的设计适合与我的框架尺寸不同的视口?

为四开本网站主页添加背景图片

把标题、段落和图片放在一起

如何在没有 JS 的情况下创建带搜索的 Select 菜单

表格布局:固定;文本溢出单元格时不起作用