我需要在表中显示JSON响应的结果。我已经用下面的方法解决了这个问题
<tr *ngFor="let result of results$ | async">
<td>{{result.max_temp}}</td>
</tr>
但我想在下面做这样的事情并且它不起作用。任何人都可以帮我解决这个问题吗?
<tr *ngFor="let result of (results$ | async)?.max_temp">
<td>{{result}}</td>
</tr>
我有这两个解决方案,我可以建议。你可以使用它们中的任何一个。
解决方案1:
<ng-container *ngIf="results$ | async as resolvedResult">
<tr *ngFor="let result of resolvedResult.max_temp">
<td>{{result}}</td>
</tr>
</ng-container>
解决方案2:
<ng-container
*ngTemplateOutlet="asyncTemplate;context:{resolvedResult: results$ | async}">
</ng-container>
<ng-template #asyncTemplate let-resolvedResult="resolvedResult">
<tr *ngFor="let result of resolvedResult.max_temp">
<td>{{result}}</td>
</tr>
</ng-template>
请注意,从Angular docs:
Angular ng-container是一个分组元素,不会干扰样式或布局,因为Angular不会将它放在DOM中。
在第二个示例中,您尝试访问结果$的max_temp
属性(这可能是可观察的返回数组)并且它没有该属性。第一个示例有效,因为您只需在该Array的实际项目(通过迭代)上访问该属性。