ngFor上的angular2切换图标

ngFor是Angular框架中的一个指令，用于在模板中循环渲染一组数据。它可以遍历一个数组或对象，并为每个元素生成相应的HTML代码。

在ngFor指令中切换图标可以通过使用条件语句和CSS类来实现。以下是一个示例：

首先，在组件中定义一个布尔类型的变量，用于控制图标的切换：

showIcon: boolean = false;

然后，在模板中使用ngFor指令循环渲染数据，并根据条件切换图标：

<ul>
  <li *ngFor="let item of items">
    {{ item.name }}
    <i class="fa" [ngClass]="{'fa-check': showIcon, 'fa-times': !showIcon}"></i>
  </li>
</ul>

在上面的示例中，使用了Font Awesome图标库中的"fa"类，并通过ngClass指令根据showIcon变量的值来切换"fa-check"和"fa-times"类，从而切换图标。

在Angular中，推荐使用ngClass指令来动态切换CSS类，以实现样式的变化。同时，可以根据具体的需求，选择适合的图标库或自定义图标。

关于ngFor和ngClass的更多详细信息，可以参考腾讯云的Angular文档：

• ngFor文档
• ngClass文档

请注意，以上提供的链接是腾讯云Ant Design的文档，Ant Design是一套基于Angular的UI组件库，提供了丰富的组件和指令，可以帮助开发者快速构建优秀的用户界面。