如何从具有角度的网格中删除和删除其空间的网格图块

Question

我正在尝试创建一个包含不同文章列表的页面，我只有一个组件，并且遍历文章列表我的问题是

1. 当我关闭/删除一篇文章时，我需要它从页面中消失，而另一元素代替它，因为我使用的是GRID，并且网格图块已经定义，所以我无法做到这一点。是否有艾米解决方案或其他方法可以做到这一点

stackBlitz example

<mat-grid-list [cols]="breakpoint" rowHeight="4:2"  
              (window:resize)="onResize($event)">
  <mat-grid-tile id="obj"
     *ngFor="let item of items"           
      [style.background]="'lightblue'">
      <div >
        <h2>Title</h2>
        <div>some sort of text in between</div>
        <button mat-raised-button class="mi-button" 
        (click)="delete()">Delete</button>
      </div>
  </mat-grid-tile>
</mat-grid-list>

内容

    delete(){
    document.getElementById("obj").style.display = 'none'
     }

Answer 1

在Angular中，您让模型决定HTML应该是什么，而不是尝试手动从DOM中删除元素。