带有 ng-tempate 的 ngTemplateOutletContext 和带有 angular 错误变量的参考值的循环不会退出

Question

我有一个组件数组如下

 <ng-container [ngTemplateOutlet]="controlArrayContainer"
     [ngTemplateOutletContext]="{controls:control?.componentProperty?.formArray, index: i}">
 </ng-container>

将上下文中的数据传递为

{controls:control?.componentProperty?.formArray, index: i}

在模板部分使用如下数据

<ng-template #controlArrayContainer let-control="controls" let-index="index">
    <ng-container *ngFor="let layout of controls; let i = index">
    </ng-container>
</ng-template>

在编译期间不断收到异常，如

Error: projects/falcon-core/src/lib/component/reactive-controls/reactive-controls.component.html:32:41 - error TS2339: Property 'controls' does not exist on type 'ReactiveControlsComponent'.

32     <ng-container *ngFor="let layout of controls; let i = index">

Answer 1

在您的代码中，您使用的是 let-control，因此您应该在 ngFor 循环中使用 control，而不是 controls:

<ng-template #controlArrayContainer let-control="controls" let-index="index">
    <ng-container *ngFor="let layout of control; let i = index">
    </ng-container>
</ng-template>

带有 ng-tempate 的 ngTemplateOutletContext 和带有 angular 错误变量的参考值的循环不会退出

ngTemplateOutletContext with ng-tempate and for loop for the reference value with angular error variable doesn't exits

javascript

typescript

angular-template

angular