javascript - Angular 2 *ngIf 为 'this'

Question

在 Angular 2 中，我有这个 component.html:

<li *ngFor="let something of somethings">
   <span>{{something}}</span>
   <input class="doit" type="text" *ngIf="iscalled" />
<div id="container">
     <button class="btn btn-warning editsection (click)="editAction()">Edit</button>
</div>
</li>

使用这个component.ts:

editAction(){ this.iscalled = true; }

iscalled 在我的组件中默认设置为 false。

基本上，对于我生成的 somethings 中的每个 something，以及我的列表，都有一个分配给它的输入字段，以及一个运行 editAction 的按钮()。仅当用户单击 editAction() 按钮时，该按钮才会出现。

现在，按原样单击 editAction() 按钮将启用列表中的所有输入字段。我想将其限制为确切的 li 元素。

我不知道 Angular 2 是否对此有特定的操作，或者这是否是一个简单的 JavaScript 解决方案。

Answer 1

注意:使用此设置时，请勿将 iscalled 的默认值设置为 false

<li *ngFor="let something of somethings">
     <span>{{something}}</span>
     <input class="doit" type="text" 
            *ngIf="something.iscalled" />       //<<<===changed

     <div id="container">
          <button class="btn btn-warning 
           editsection 
           (click)="editAction(something)">     //<<<===changed
              Edit
           </button>   
     </div>
</li>

<小时/>

editAction(something){ something.iscalled = true; }

如果您想切换它，那么您可以执行以下操作，

editAction(something){ something.iscalled != something.iscalled; }