如何在 *ngFor 角度迭代期间调用函数？答案

【问题标题】：How to call a function during *ngFor iteration in angular?如何在 *ngFor 角度迭代期间调用函数？
【发布时间】：2021-06-21 20:50:06
【问题描述】：

我有一个基于视图模式显示项目的场景。所以我想在每次迭代期间更改 viewMode 但我不能。任何人都可以有任何想法吗？让我知道。谢谢

<div *ngFor="let pr of d.data; viewMode();"> 
// rendering content according to viewMode

【问题讨论】：

你说不通：为什么“根据”视图模式渲染需要“改变”它？
基本上我是从某些数据创建时间线视图。所以我希望everyIteration 我想在左侧和右侧显示项目.....aw viewMode 我想设置为左视图和右视图，并基于这个值我使用classBinding 来应用我的样式！ @meriton
您可以使用 ngIf 或 ngSwitch 并根据视图加载内容
@Amrit for ngIf 我需要表达。为此，我在组件中声明了属性。并想调用一个函数来切换该属性值！

标签： angular angular2-template angular-directive ngfor

【解决方案1】：

我们可以将奇数或偶数布尔值别名为局部变量以避免模运算。例如<li *ngFor="let user of users; even as isEven">

@根据https://stackoverflow.com/users/13676960/hopey-one回答谢谢@Hopey One

【讨论】：

【解决方案2】：

有一个解决方法。

场景 1：如果你在组件内部传递 viewMode

<div *ngFor="let pr of d.data; let i = index;">
    <your-component [viewMode]="i % 2 === 0 ? viewMode1 : viewMode2" *ngIf="i % 2 === 0">
    </your-component>
</div>

场景二：如果要根据viewMode渲染不同的组件

<div *ngFor="let pr of d.data; let i = index;">
    <your-component1 *ngIf="i % 2 === 0"><!--According to first viewMode-->
    </your-component1>
    <your-component2 *ngIf="i % 2 === 1"><!--According to second viewMode-->
    </your-component2>
</div>

注意：这里i % 2 === 0 将检查奇数/事件。因此，您的切换将以这种方式工作。

【讨论】：

您还可以将odd 或even 布尔值别名为局部变量以避免模运算。例如<li *ngFor="let user of users; even as isEven">
不知道。谢谢。