使用 toSignal 代替异步管道的好处

Question

例如，我需要通过http请求获取一些数据并将接收到的值分配到模板中的某处。我想知道以下哪种解决方案更好以及在这种情况下使用signals是否有优势？

export class MessagesComponent {
    private messages$ = this.messagesService.getMessages();
    public messages = toSignal(this.messages$);
 }

在模板中

[items]="messages()"

export class MessagesComponent implements OnInit{
    public messages$: Observable<Tag[]>;
        
     ngOnInit() {
         this.messages$ = this.messagesService.getMessages();
     }
   }

在模板中

[items]="messages$ | async"

Answer 1

如果您有依赖于

this.message$

的数据，信号会更好。

messages = toSignal(this.messagesService.getMessages());
filteredMessages = computed(() => {
  return this.messages().filter(value => value.role === 'admin' /* for example */
}));

如果你必须纯粹用可观察量来做到这一点，你将需要两个订阅、一个共享、一些管道（映射）、多个属性..或其他东西..这并不难做到，但信号更好、更容易在上述情况下进行推理。作为奖励，如果尝试减小组件大小（导入片段而不是

AsyncPipe

、使用独立版本等），则不需要

CommonModule

导入。

我还认为 Angular 团队正在朝这个方向发展，所以尽可能使用信号应该是一个好主意，只是为了可维护性。