ANGULAR 7重新加载组件视图

Question

ANGULAR 7重新加载组件视图

5

我希望通过点击按钮图标重新加载组件视图，而无需刷新整个页面。

我的视图代码：

<nb-card>
  <nb-card-header>
    <div class="row" style="font-size: 2.125rem !important;">
      <div class="col-sm-8">
        Tableau des Casiers 
      </div>
      <div class="col-sm-4 d-flex justify-content-end">
        <nb-action icon="ion-refresh sizeicone" (click)="refresh()"></nb-action>
      </div>
    </div>
  </nb-card-header>

  <nb-card-body>
    <ng2-smart-table [settings]="settings" (custom)="onCustom($event)" [source]="source"
      (deleteConfirm)="onDeleteConfirm($event)" (editConfirm)="onSaveConfirm($event)"
      (createConfirm)="onCreateConfirm($event)">
    </ng2-smart-table>
  </nb-card-body>
</nb-card>

- Soukaina Benchekroun

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Kamil Kiełczewski · Accepted Answer

在Angular中，您不需要刷新组件 - 当检测到模板中使用的变量发生更改时，Angular会自动刷新页面内容。因此，在refresh()方法中只需更新变量值即可。但是，如果您真的想手动刷新，则可以使用以下结构：

模板：

<my-component *ngIf="showComponent"></my-component>

ts文件：

public refresh() {
   this.showComponent=false;
   setTimeout(x=>this.showComponent=true);
}