时间戳

首页 > 解决方案 > 发布许多空值

angular - 发布许多空值

问题描述

我正在尝试生成一个项目，其中一方面有一系列目标，另一方面有一系列文章。所以我的想法是我加载那些目标所在的文章，如果它们不匹配，它们不会显示任何内容，因为我在组件的 HTML 文件中生成了以下代码：

<div *ngFor="let articulo of spiderService.articulos">
    <div *ngIf="articulo.titulo.includes(target.nombre)">
        <p *ngIf="true">{{articulo.titulo}} - test</p>
    </div>
</div>

我的问题是我有超过 3,200 篇文章，我加载了以下代码：

<div _ngcontent-c1="" class="card-stacked  col s12"></div>

这个 div 由我生成 15 次，这是我在数据库中拥有的目标数量，在这个 div 中，我每篇文章生成另外 3,200 个 div，如果文章的标题与它显示给我的目标名称匹配在屏幕上完美，但是那些不匹配的会生成那个空的 div，这给我的设计和其他人带来了很多问题。

任何解决方案？

标签： angularmean-stackmean

解决方案

您可以将 spiderService.articulos 拆分为多个数组（targetName1Articles、targetName2Articles 等）。您将在 ngInit 上填充这些数组。这样做你可以在卡片堆叠中添加一个 ngIf 检查这个数组的长度是否> 0 例如：

<div _ngcontent-c1="" class="card-stacked  col s12" *ngIf="target1Articles && target1Articles.length > 0"></div>

希望它可以帮助你

推荐阅读