Question

我正在制作角度项目。当我点击复选框时，我希望通过文本有一条线。但是，当我点击复选框时，没有任何事情发生..

你能帮帮我吗？

谢谢！

  <h3>Todos list</h3>
<ul class="list-group">
   <li *ngFor="let todo of todos; let i = index" class="list-group-item">
     {{todo.text}}
 <p [ngClass]="{strike: deleted}">test</p>

<label>
   <input type="checkbox" ng-model="deleted">
</label>

<button class="btn btn-danger btn-small" (click)="deleteTodo(i)">X</button>
    </li>
</ul>

Answer 1

首先，在Angular中，它是[(ngModel)]，而不是ng-model中的AngularJs。

此外，您无法使用单个变量（deleted）来处理*ngFor中的所有项。

要使其适用更改：

...
<p [ngClass]="{strike: todo.deleted}">test</p> 

<label>
  <input type="checkbox" 
         [(ngModel)]="todo.deleted"> 
</label> 
...

DEMO

Answer 2

使用<s>标签代替<strike>标签例如：如果您想<strike> Not Aailable </strike> 而那时，Angular 4及更高版本不支持该功能，使用<s>Not Available</s>

ngclass打击角度

2 个答案: