Typescript 如何将@for的结果绑定到变量

发布于05月01日

在Angular 16(及更早版本)中，可以在for循环后面使用"as"来将过滤后的结果声明为变量.

这样:

<div *ngFor="let item of (items | pipe: Query) as results">
{{item}}
</div>

如何在angular 17中实现这一目标？

我已经try 过使用了

@for (let item of (items | pipe: Query) as results; track item.id) {
<div>
{{item}}
</div>
}

但这并不起作用. 我希望能够使用我的过滤结果并将它们存储在物品数组中.

这可能吗？如有任何帮助，我们将不胜感激！

推荐答案

在Angular 17控制流语法中，@for不支持集合别名(即使用as关键字).

See this issue on GitHub，此处有相关引用:

如上所述，@for不支持集合的别名.

当迁移期间检测到as时，角迁移目前不会但应该记录警告. 有一个开放的issue to fix that.

另一种方法是，如果您想要显式别名，则使用@if中的管道提取结果，然后在@for中使用它们.类似于这样的:

@if (items$ | async; as results) {

@for (item of results; track item.id) {
<div>
{{item}}
</div>
}

实用课程推荐