我有一个角度的应用程序。我有下面的代码,我尝试过。
<div class="row" *ngIf="year>0 && month>0">
<div class="col-lg-12">
<table class="table table-bordered">
<thead>
<tr>
<th class="">Organization</th>
<th *ngFor="let pos of positions">{{pos.POSITION}}</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let org of orgs">
<td>{{org.ORG_NAME}}</td>
<td *ngFor="let pos of positions">
<div *ngFor="let el of budget">
<div *ngIf="el.ORG_ID==org.ORG_ID && el.POS_ID==pos.ID">
<input type="number" [(ngModel)]="el.AMOUNT" />
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
上面的代码我试图从数组创建动态表
组织喜欢
[{ORG_ID:1,ORG_NAME:"TEST"}]
里面有114个元素
pos喜欢
[{ID:1,POSITION:"TEST"}]
里面有16个元素
和预算一样
[{POS_ID:1,ORG_ID:9,AMOUNT:5}]
里面有1824个元素 我想创建一个pos orgs表并放置与预算元素匹配的输入元素。但是,当我运行页面时,它给出了内存不足的错误页面。
我怎么解决这个问题?
提前致谢
您可以在预算循环中使用管道过滤器来代替ngIf指令:
<div class="row" *ngIf="year>0 && month>0">
<div class="col-lg-12">
<table class="table table-bordered">
<thead>
<tr>
<th class="">Organization</th>
<th *ngFor="let pos of positions">{{pos.POSITION}}</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let org of orgs">
<td>{{org.ORG_NAME}}</td>
<td *ngFor="let pos of positions">
<ng-container*ngFor="let el of budget | filterBudget: pos.ID : org.ORG_ID">
<input type="number" [(ngModel)]="el.AMOUNT" />
</ng-container>
</td>
</tr>
</tbody>
</table>
</div>
</div>
filterBudgetPipe:
@Pipe({
name: 'filterBudget'
})
export class FilterBudgetPipe implements PipeTransform {
transform(budgets: Budget[], posId: number, orgId: number): Budget[] {
return budgets.filter(budget => budget.ID === posId && budget.ORG_ID === orgId);
}
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句