How to generate div and display different data from array-CodePudding

I'm working on an angular project and I tried to use *ngFor to generate more divs and then display data from array with ngfor index

the code from the html file (numss=5) `

<div  *ngFor="let x of numss">
    <div >Allocation Key Data</div>
    <form action="#" *ngIf="newAcc">        
        <div  >
            <div >
   <span >Provider Account ID</span>
<input type="text"  placeholder="Provider Account ID [value]="newAcc.body.unitData[x].provider_account_id">
            </div>
            <div >
                <span >Percentage</span>
                <input type="text" placeholder="Percentage" [value]="newAcc.body.unitData[x].percentage">
            </div>
</div>
</form>

CodePudding user response：

You have to adjust your code like that:

<div  *ngFor="let x of newAcc">
    <div >Allocation Key Data</div>
    <div  >
        <div >
            <span >Provider Account ID</span>
            <input type="text"  placeholder="Provider Account ID" [value]="x.provider_account_id">
        </div>
        <div >
            <span >Percentage</span>
            <input type="text" placeholder="Percentage" [value]="x.percentage">
        </div>
    </div>
</div>

ngFor works like a foreach.

You also missed a " in placeholder="Provider Account ID".