时间戳

首页 > 解决方案 > 更新我要显示的项目列表时，使用 ngFor 动态添加组件不起作用

angular - 更新我要显示的项目列表时，使用 ngFor 动态添加组件不起作用

问题描述

我试图让一个组件在 Angular 中动态地将组件添加到它的一个容器中。无论ngFor有没有DynamicComponentLoader. 如果我在构建对象之前给出我想要显示的项目的列表，这会很好。现在，我最初有一个空列表，其中包含添加、删除和更新的项目。我希望从该列表中制作的组件反映从该列表中所做的更改。

这是我当前的代码：

HTML：

<div id = "simple_pov_games_container">
        <app-games-card-view *ngFor = "let gameCard of simplePOVGames; let i = index"
          [gameCard] = "gameCard">
            <p>Hello</p>
        </app-games-card-view>
</div>

零件

  public simplePOVgames: ICommonGameCard[] = [];
  private addGameCard(gamecard: ICommonGameCard): void {
    gamecard.pov === POVType.Simple
    ? this.simplePOVgames.push(gamecard)
    : this.freePOVgames.push(gamecard);
  }

不幸的是，当我向列表中添加元素时，组件并没有被添加到 HTML 中。除了必须使用 a 之外，还有其他方法可以做到这一点DynamicComponentLoader吗？

标签： angulartypescript

解决方案

推荐阅读