1

各期間の月数を含むノックアウトviewModelのobservableArrayとしてProjectPeriodアイテムのリストがあります。foreachの各行の終了日を表示したいと思います。現在、viewModelでko.computed値を使用していますが、表示されているアイテムまで各アイテムをループすることができません。foreachの現在のアイテムまでしか表示されていない値をループして合計するにはどうすればよいですか？

現在、私は次のHTMLを持っています。

<table>
    <tr class="tableHeader">
        <th>Period</th>
        <th>Number of Months</th>
        <th>End of Period</th>
    </tr>
    <tbody data-bind="foreach: ProjectPeriod">
        <tr>
            <td><input data-bind="value: ProjectYearText" /></td>
            <td><input data-bind="value: PeriodMonths" /></td>
            <td data-bind="text: endDate"></td>
        </tr>
    </tbody>
</table>

および次のviewModel：

function ProjectPeriod(projectYearId, projectYearText, periodMonths, viewModel) {
    var self = this;
        self.ProjectYearId = projectYearId;
        self.ProjectYearText = ko.observable(projectYearText);
        self.PeriodMonths = ko.observable(periodMonths);
        self.viewModel = viewModel;

        self.endDate = ko.computed(function () {
            var startDate = hfProjectDates.Get("ProjectStartDate");

            // Calculate the number of months from the beginning to the current period.
            var monthCount = 0;
            ko.utils.arrayForEach(self.viewModel.ProjectPeriods(), function (projectPeriod) {
                if (projectPeriod.ProjectYearId < self.ProjectYearId)
                    monthCount += projectPeriod.PeriodMonths;
                });

            var endDate = moment(startDate).add('M', monthCount);
            return endDate ? endDate.format("M/DD/YYYY") : "None";
        });
    }

    function ProjectPeriodViewModel() {
        // Data
        var self = this;

        self.ProjectPeriods = ko.observableArray([
            new ProjectPeriod(1, "1st Year", 12, ProjectPeriodViewModel),
            new ProjectPeriod(2, "2nd Year", 12, ProjectPeriodViewModel),
            new ProjectPeriod(3, "3rd Year", 12, ProjectPeriodViewModel)
        ]);

    }

私は本当にノックアウトを始めたばかりなので、これに取り組む方法にはいくつかの問題があると思います。ただし、具体的には、実行終了日を表示する必要があります。

更新： Mattのフィードバックに基づいて、ProjectPeriodにオブザーバブルを含めるように更新しましたが、viewModelから参照を取得し、配列を反復処理する際に問題が発生しています。

4

1 に答える 1

0

これにアプローチする方法はいくつかあります。おそらく、計算されたプロパティをProjectPeriodオブジェクト自体に移動ProjectPeriodし、親への参照を与えることです。そうすればProjectPeriodViewModel、ProjectPeriodにアクセスしてProjectPeriods逆方向にカウントし、すべてを合計することができます。その前の期間（これを簡単にするために、各期間にインデックスプロパティを指定することをお勧めします）。

于 2012-11-20T01:43:48.130 に答える