我想建立一个复选框结构,我想动态地处理它。我的服务返回了一个对象响应。然而,当我在上下文中使用这个函数时,我会得到一个字符串返回,我不能使用ngfor。
form.demo.component.ts
getElementChoicesByNKey(nkey:string):choiceModel[]{
var element = this.findInComponentsByNKey(nkey);
var res = element.Choices;
return res;
}
此函数提供正确的返回。
form.demo.component.html
...
<ng-container *ngIf="item.Type == 'Choice'">
<ng-container *ngTemplateOutlet="choiceTheme; context:{ Id: item.Id, Label: item.Label, Choices: getElementChoicesByNKey(item.Id) }"></ng-container>
</ng-container>
...
<ng-template #choiceTheme let-Id="Id" let-Label="Label" let-Choices="Choices">
<nz-form-item>
<nz-form-label nzFor="Id">{{Label}}</nz-form-label>
<nz-form-control [formControlName]="Id" nzErrorTip="{{ 'form.requiredText' | translate }}">
<p>{{Choices.length}}</p>
<div *ngFor="let item of Choices">
<p>test</p>
</div>
</nz-form-control>
</nz-form-item>
</ng-template>
...
此处选项显示为字符串,不允许我使用ngfor。我得到一个错误如下。
找不到类型为“string”的不同支持对象“[{label:'apple',value:'apple',checked:true},{label:'pear',value:'pear',checked:false},{label:'orange',value:'orange',checked:false}]”。ngfor只支持绑定到数组之类的可重用文件。
我错过了什么?谢谢你的帮助。
1条答案
按热度按时间l7wslrjt1#
使用
*ngFor="let item of getChoices(Choices)"
在模板和中component.ts
```getChoices(choiceStr) {
return JSON.parse(choiceStr);
}