使用map在Angular2中显示和隐藏组件

时间:2017-04-05 01:33:10

标签: angular typescript

我有一个角度为2的对象数组。它总是很小,所以我只是用ngFor渲染它。我想在每个项目旁边显示一个编辑图标,当您单击它时,用编辑框替换文本并保存和取消图标。这是后端,此代码在显示对话框之前设置Map。

  public open() {
    this.showEdit = new Map<number, boolean>();

    for(let n =0;n < this.authService.families.length;++n)
    {
      this.showEdit[n] = false;
    }

    this.opened = true;
  }

然后,这是我的模板:

<div *ngFor="let f of authService.families; let i = index">
  <span *ngIf="!showEdit[index]"> {{f.name}} </span>
  <span *ngIf="showEdit[index]">
    <input type="text" value="{{f.name}}"/>
     <span class="glyphicon glyphicon-save" (click)="onSave(f.id, i)"></span>
  </span>
   <span *ngIf="!showEdit[index]" class="glyphicon glyphicon-edit" (click)="onEdit(f.id, i)"></span>
</div>

因此,我们显示名称,方法应该切换Map中的值(它确实),然后ngIf应该切换并显示另一个控件。这不起作用。单击切换不会执行任何操作。

问题似乎与地图有关,因为如果我创建一个独立的布尔值并使用它,它可以正常工作....

由于

0 个答案:

没有答案