显示在其他组件中定义的消息

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>

显示在其他组件中定义的消息

Show message defined in other component

angular2-template

angular