首页 > 解决方案 > 使用 javascript 解析 html 中的数组并每次呈现不同的跨度

问题描述

如何使此代码更通用:

               <div class="xx" *ngIf="this.message.address">
                    <span class="helper" *ngIf="this.message.address">
                       {{ this.errorMessage.address[0] }} 
                    </span>
                    <span class="helper" *ngIf="this.message.address[1]">
                            {{ this.errorMessage.address[1] }} 
                         </span>
                </div>

以便为每个数组元素多次呈现此跨度:

          <span class="xx" *ngIf="this.message.address.forEach(x=> x">
               {{ this.errorMessage.address[x] }} 
            </span>

(顺便说一下,我上面的尝试不起作用)

我只能让它在角度组件中工作,比如:

this.message.address.forEach(x=> console.log(x))

但我不确定如何解析 html 中的数组并在每种情况下呈现不同的跨度,这是我真正需要的

标签: javascripthtmlangular

解决方案


您正在寻找的是*ngFor,它可以在您的 HTML 中用于迭代一组元素。

<div class="xx" *ngFor="let ad of this.message.address">
  <span class="helper" *ngIf="ad">
    {{ ad }} 
  </span>
</div>

推荐阅读