Question

所以我现在有这个模板部分：

<template ngFor let-item [ngForOf]="arrayWithItems">
    <tr class="item" (click)="child.toggleActive()" #child [item]="item" item-component>
    <tr class="detail" *ngIf="item.details && !item.errmsg" [details]="item.details" detail-component>
    <tr class="detail" *ngIf="item.errmsg">
        <td colspan="3">
            <p>{{ item.errmsg }}</p>
        </td>
     </tr>
</template>

当用户点击item-component时，item-component会检索项目的详细信息（使用服务）并将其设置为item.details。由于设置了item.details，因此会显示detail-component（*ngIf为真）。但是我希望每当出现问题时（如返回无效的json），它会显示一条消息。我面临的问题：消息是在item-component。

中定义的

我怎样才能按照我想要的方式完成这项工作？请注意Item是一个模型。所以我现在item.errmsg不起作用。除了将errmsg键添加到模型之外，我还想要一种替代方法。

Answer 1

您已经为变量#child分配了组件。您可以在模板中使用它来访问item-component。

<template ngFor let-item [ngForOf]="arrayWithItems">
    <tr class="item" (click)="child.toggleActive()" #child [item]="item" item-component>
    <tr class="detail" *ngIf="item.details && !item.errmsg" [details]="item.details" detail-component>
    <tr class="detail" *ngIf="child.errmsg">
        <td colspan="3">
            <p>{{ child.errmsg }}</p>
        </td>
     </tr>
</template>

显示在其他组件

1 个答案: