Javascript Onclick切换单个列表项类图标角度4 5 Todo应用程序

我正在与之斗争，并试图找到解决办法，但失败了

我有一段代码，列出了输入中的所有项目，我需要在单击时打开和关闭复选图标。现在，它可以切换所有图标，而不是单个图标

 <p *ngFor="let task of tasks; let i = index" class=tasks @fade>
 <span class="task">
 <fa name="check" (click)="status=!status"  
[ngClass]="status ? 'check' : 'uncheck'"></fa>
{{task}}</span>
<button class="remove" (click)="removeItem(i)"><fa name="trash" 
class="delete"></fa></button>
</p>

任何建议都会有帮助。 祝你今天愉快

更新：

---

对于有类似问题的人，我找到了解决办法。只需在列表项中放置输入标记，并按照您的意愿设置其样式。它将为每个项目独立工作。

您可以在

任务

对象中添加

状态

属性，结果如下：

<p *ngFor="let task of tasks; let i = index" class=tasks @fade>
    <span class="task">
        <fa name="check" (click)="task.status=!task.status"  
          [ngClass]="task.status ? 'check' : 'uncheck'"></fa>
        {{task}}
    </span>
    <button class="remove" (click)="removeItem(i)"><fa name="trash" 
      class="delete"></fa></button>
</p>

{{task}}

在*ngFor for每个复选框中使用ngModel看起来您在每个任务之间共享'status'变量-我可能只会使用状态数组，因此您只处理*ngFor中的状态[I]。您还可以在tasksHi中的每个任务中包含一个“status”参数。谢谢你的回答。我现在得到了它，但无法将状态添加到任务中。您的意思是在这里>>>导出类TasksComponent实现OnInit{task:string=”“；tasks=[]；itemCounter:number；以及如何编写它是的，只需将任务从字符串转换为对象：task:{value:string；status:boolean；}谢谢，但现在它使我在本地存储上存储项目的其他函数中遇到了问题。我找到了使用输入标记的解决方法。

<p *ngFor="let task of tasks; let i = index" class=tasks @fade>
    <span class="task">
        <fa name="check" (click)="task.status=!task.status"  
          [ngClass]="task.status ? 'check' : 'uncheck'"></fa>
        {{task}}
    </span>
    <button class="remove" (click)="removeItem(i)"><fa name="trash" 
      class="delete"></fa></button>
</p>