在Angular 12中使用signalR时，需要注意到变化检测的变化。在以前的版本中，每当收到一个新消息时，Angular会自动运行变化检测，以更新UI。但在Angular 12中，这个行为已经改变，需要手动通知Angular来运行变化检测。这是由于Angular 12引入了新的变化检测策略。

为了解决这个问题，我们需要在Angular的组件中手动通知它进行变化检测。我们可以使用ChangeDetectorRef来实现这个目的。ChangeDetectorRef是Angular提供的服务，用于手动运行变化检测。

以下是一个示例代码：

import { Component, OnInit, ChangeDetectorRef } from '@angular/core'; import { HubConnection, HubConnectionBuilder } from '@microsoft/signalr';

@Component({ selector: 'app-signalr', templateUrl: './signalr.component.html', styleUrls: ['./signalr.component.css'] }) export class SignalrComponent implements OnInit { private hubConnection!: HubConnection;

constructor(private changeDetectorRef: ChangeDetectorRef) { }

ngOnInit(): void { this.hubConnection = new HubConnectionBuilder() .withUrl('https://localhost:5001/hub') .build();

this.hubConnection.on('ReceiveMessage', (user: string, message: string) => {
  console.log(message);
  this.changeDetectorRef.detectChanges(); //手动运行变化检测
});

this.hubConnection.start()
                 .then(() => console.log('SignalR connection started'))
                 .catch(err => console.log('Error while starting connection: ' + err))

} }

在上面的代码中，我们在组件的构造函数中注入了ChangeDetectorRef服务，并在OnInit方法中创建了一个signalR连接。当我们收到一个新消息时，我们调用changeDetectorRef的detectChanges方法来手动触发变化检测。

使用这种方法，我们可以确保每次收到新的signalR消息时