javascript - knockout arrayForEach 未定义的属性

Question

我在尝试从 knockout 可观察数组中的每个项目中获取一个数字并将这些数字加在一起并将其分配给另一个计算变量时遇到了问题。这是我现在拥有的...

Semesters: ko.observableArray([
    {
        semesterName: "Fall",
        semesterCode: "300",
        PlannedCourses: ko.observableArray([]),
        totalCredits: ko.computed(function(){
            var total = 0;
            ko.utils.arrayForEach(this.PlannedCourses, function (course) {
                total += course.MinHours();
            });

            return total;
        }),
    },
    ...

我想做的是，在 totalCredits 变量中，我尝试遍历 PlannedCourses 数组并获取每个项目的 MinHours 变量，并将它们加在一起到 total 变量中。然后我将它返回到 Semesters 数组中的 totalCredits 项。我遇到的问题是在 ko.utils.arrayForEach 部分获取 PlannedCourses 变量。我得到一个未定义的，我不确定为什么。我认为这是一个简单的语法错误，但我看不出有什么问题。

PlannedCourses 可观察数组是一个动态对象，可以正确获取 PlannedCourses 列表。它是在其自身的上下文中定义的，但我没有将其正确传递给 totalCredits 计算函数。

我希望这已经足够清楚了。感谢您的帮助!

注意:所有其余代码都按预期工作。唯一不起作用的部分是 totalCredits 计算函数。我不确定 ko.utils.arrayForEach 中的任何东西是否正常工作，因为我还没能做到这一点。

Answer 1

您将需要更改填充Semesters 可观察数组的方式，以使用构造函数来获取对this 正确范围的引用:

function semester(name, code) {
    this.Name = name;
    this.Code = code;
    this.PlannedCourses = ko.observableArray([]);
    this.totalCredits = ko.computed(function(){
        var total = 0;
        ko.utils.arrayForEach(this.PlannedCourses(), function (course) {
            //Note the change to "this.PlannedCourses()" above to get the underlying array
            total += course.MinHours();
        });

        return total;
    }, this); //now we can pass "this" as the context for the computed
}

看看我们现在如何将对象传递给 ko.computed 的第二个参数，以用作内部函数中 this 的上下文。有关详细信息，请参阅 knockout 文档:Managing 'this' .

然后在填充数组时创建 semester 的新实例:

Semesters: ko.observableArray([
    new semester("Fall", "300"),
    new semester(...)
]);

这种方法还意味着您可以以一致的方式创建您的semester 对象(计算只为一件事定义一次)，而不是可能在您最初可能有的任何重复中加入拼写错误等.