parse array in html with javascript and render a different span each time

Question

How can I make this code more general:

               <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>

so that this span is rendered multiple times for each array element:

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

(my attempt above doesn't work by the way)

I could only make it work in the angular component, sth like:

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

but I'm not sure how to parse an array in html and render a different span in each case, which is what I really need

why not using *ngFor for iteration?

Pardeep Jain
– Pardeep Jain

2018-05-02 09:58:56 +00:00
Commented May 2, 2018 at 9:58 — Pardeep Jain
– Pardeep Jain, Commented May 2, 2018 at 9:58

bugs · Accepted Answer · 2018-05-02 10:00:22Z

1

What you are looking for is *ngFor, which can be used in your HTML to iterate over an array of elements.

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

answered May 2, 2018 at 10:00

bugs

15.4k6 gold badges53 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

parse array in html with javascript and render a different span each time

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related