使用接收值动态更改 Angular Label

Question

我正在研究 Angular - 节点 websockets，场景是单击按钮时，它将向服务器发送请求并获取数据并在客户端更新接收到的数据。 但它并没有改变。 代码如下。

Label 在组件 HTML

<h2>{{iSpeed}}</h2>

组件.ts

    iSpeed: any;
    
    //BUTTONCLICK
    speedTest(){
        //WORKS
        this.iSpeed = "LOADING";
        socket.emit("checkedTrue");
    }
    ngOnInit(): void {
        socket.on('acknowledged', (data: any) =>{
            //LABEL CHANGE
            this.iSpeed = data.internetSpeed;
            alert(this.intSpeed = data.internetSpeed);
        })
    }

Angular 新手，我哪里傻了？

Answer 1

看起来像是变更检测的问题。 你可以试试这个

constructor(private cdr: ChangeDetectorRef) {}

ngOnInit(): void {
    socket.on('acknowledged', (data: any) =>{
        //LABEL CHANGE
        this.iSpeed = data.internetSpeed;
        
        this.cdr.detectChanges();
        alert(this.intSpeed = data.internetSpeed);
    })
}

如果您使用 onPush 更改检测策略，则第一种情况有效，因为单击后会调用更改检测，但第二种情况不会