Angular新控制流中@for结合async管道及变量别名的语法疑问

目前Angular新控制流（@if/@for）不支持将async管道的订阅赋值与遍历合并为单行语法，必须通过@if先处理async订阅并赋值变量，再嵌套@for实现遍历。

旧写法*ngFor="let option of options$ | async as options"是把「订阅Observable、存储结果为模板变量、遍历结果」三个逻辑合并在了一个指令里，但新控制流的@for语法仅接受可迭代数据源，无法在数据源表达式中通过as关键字将async管道的结果存为模板变量——这是新控制流语法设计上的限制。

推荐的标准写法（嵌套结构）：

@if (options$ | async; as options) {
  @for (option of options; track option.id) {
    <div>{{ option.label }}</div>
  }
}

如果觉得嵌套不够简洁，也可以在组件类层面提前处理Observable：比如在组件中定义options属性，通过subscribe或者结合变更检测策略的组件内async处理方式提前获取数据，不过模板内的@if+@for嵌套是官方推荐的模板侧处理方案。

另外注意：新控制流的@for必须指定track表达式，对应旧*ngFor的trackBy，用于优化列表渲染性能，这是语法强制要求。

内容的提问来源于stack exchange，提问作者Wilt