Angular 2 嵌套 *ngFor

Posted 2023-03-13

【中文标题】Angular 2 嵌套 *ngFor

【英文标题】：Angular 2 Nested *ngFor

【发布时间】：2018-10-13 05:29:09

【问题描述】：

我目前正在尝试将一些索引传递给函数，但第一个参数 (ii) 返回未定义。

<div *ngFor="let tab of screen.data.tabs; let index = i;">
    <div *ngIf="tab.active">
        <div *ngIf="tab.questions">
            <div *ngFor="let question of tab.questions; let index = ii;">
                <div class="scenarioContainerQUESTION">
                    <p [innerhtml]="question.text"></p>
                    <div *ngFor="let option of question.options; let iii = index;" class="option" [ngClass]="'optionSelected': option.selected">
                        <label [for]="ii+'_'+iii">option.text</label>
                        <input [id]="ii+'_'+iii" [name]="'group'+ii" type="radio" [value]="ii" (click)="optionClicked(ii,iii)" />
                    </div>
                    <button [ngClass]="'fade': selectedOption == -1" (click)="ManageSubmit()">SUBMIT</button>
                </div>
            </div>
        </div>
    </div>
</div>

【问题讨论】：

您实际使用的是 ng2，还是最新的 - ng5？

试试let i = index和let ii = index（只有let iii = index可以）。

@pixelbits 我正在使用 ng5

【参考方案1】：

您应该为变量分配索引值，而不是相反，

<div *ngFor="let tab of screen.data.tabs; let i= index;">

还有

<div *ngFor="let question of tab.questions; let ii= index;">

【讨论】：

我知道这将是一件小事哈哈感谢大家的快速反应。

【参考方案2】：

查看ngFor 的文档。绑定index的正确语法：

<li *ngFor="let item of items; index as i; trackBy: trackByFn">...</li>