来自子输入元素的Angular 4求和值

Question

我有一个问题，我无法解决。 我正在尝试创建一个表，它将计算每行和每列输入的数字。

我的申请结构是：

TableComponent
ProjectComponent
LineComponent
inputComponent

表component.html：

<div *ngFor="let project of tableData | projectsPipe">
<div class="row ">
    <table class="col-sm-8 table-dates">
        <tr>
            <td *ngFor="let day of dates;">
                <div><sum></sum></div>
            </td>
            <td>
                <div class="sum">0</div>
            </td>
        </tr>
    </table>
</div>
<div *ngFor="let item of Items">
    <div *ngIf="workitem.teamProject == project.teamProject">
        <div class="item">
            <task-line ></task-line>
        </div>
    </div>
</div>

和lineComponent.html：

<div class="row task-line">
<div class="col-sm-4">
    <div class="title">{{title.title}}</div>
</div>
<table class="col-sm-8 table-dates">
    <tr>
        <td *ngFor="let day of dates">
            <table-cell></table-cell>
        </td>
        <td>
            <div class="task-sum-column">{{sum}}</div>
        </td>
    </tr>
</table>

如果我改变第3栏中的第2行，我就无法实现这一点 总和将重新计算。

有任何建议如何实现它？

修改 假设我有这段代码：

    <div *ngFor="let prvky of pole">
    <app-riadok></app-riadok>
</div>
<div>sum : {{sum}}</div>

app-riadok是具有简单输入的组件，当我在输入内部更改值时 我需要再次启动ngFor循环所有组件并将它们的值相加，然后在sum div中显示

Answer 1

您应该通过 @Input 传递参考资料，请参阅https://angular.io/guide/component-interaction

使用 ngOnChanges

跟踪更改

注意输入上的模型更改只有在不是对象时才会触发。那应该是值