Angular2-如何通过ngFor删除ng模板中的项目

Question

我只想删除ngFor中的项目，但是当我单击删除按钮时，它将始终重新加载页面。我知道ng模板有问题。有什么建议吗？多谢！

这是代码：

<ngb-accordion [closeOthers]="true" #acc="ngbAccordion" class="ngb-accordion" activeIds="ngb0">
     <ngb-panel *ngFor="let stock of StockInvestForecast;let i = index" id="ngb{{i}}">
        <ng-template ngbPanelTitle>
           <span>
              <h4 class="text-purple">{{stock.StockName}}</h4>
              <button type="button" (click)="StockInvestForecast.splice(i,1)" class="btn icon-close-btn">
                <i class="fa fa-close"></i>
              </button>
          </span>
      </ng-template>
</ngb-accordion>

Answer 1

手

风琴使用带有空白href(href="(的a(锚点(，当您单击标题部分中的button时，它会冒出该事件并触发href。这往往会将URL更改为""(空白(，但是您有默认重定向，它正在重定向到公共页面。你必须防止事件向上传播， 使用手风琴标题上的.preventDefault().

 <button type="button" class="btn icon-close-btn"
     (click)="$event.preventDefault();StockInvestForecast.splice(i,1)">
    <i class="fa fa-close"></i>
 </button>