Question

<tr *ngFor = 'let student of students>
<td  contenteditable="true"  class ='phone' #button>
{{student.phone}}
<i (click)='showbox()' class = '    glyphicon glyphicon-edit'></i>
<input *ngIf='showinput' type="text"   
   class="phone form-control required email "  style="height:38px;">
</td>
</tr>


showbox(){
  this.showinput = true;
}

在这里，当我点击<td>时，它应该打开输入标签，但只需点击一下，它也会打开其他列。有人可以建议帮忙吗？

Answer 1

showinput变量在组件的上下文中声明。

因此，当您单击td标记时，变量的值会正确更改，但由于上下文是组件，因此它会影响组件中的每个td。

如果您希望变量仅影响td，那么请将student变量用于上下文。

<td  contenteditable="true"  class ='phone' (click)='showbox(student)' #button>{{student.phone}}
         <input *ngIf='student.showinput' type="text" [(ngModel)] = 'student.phone' class="phone form-control required email " style="height:38px;">
    </td>

组件：

showbox(student) {
    student.showinput = true;
}

* ng在一次点击angular2上发射所有colums

1 个答案: