获取 MVC Knockout 中可变长度列表中项目的总和答案

【问题标题】：Get the sum of on item in a variable length list in MVC Knockout获取 MVC Knockout 中可变长度列表中项目的总和
【发布时间】：2015-05-24 03:39:42
【问题描述】：

我使用敲除和 ajax post 将文档上传到服务器，并返回文档信息，然后将其显示在表格中。

我使用Steven Sanderson's Example 来执行此操作。

这很好用。

但是，我想获得所有文件大小的总和。我试过这个：

    self.Upload = function () {
            var formData = new FormData();
            var file = document.getElementById("fileupload").files[0];
            formData.append("FileUpload", file);
            var action = "Upload";

            $.ajax({
                type: "POST",
                url: options.url + action,
                data: formData,
                contentType: false,
                processData: false,
                success: function (result) {
                    self.AddDoc(result);
                }
            });
        }

        self.AddDoc = function (data) {
            self.Model.CurrentStep().Files.push({ ID: data.ID, Name: data.Name, Extension: data.Extension, ContentType: data.ContentType, Size: data.Size, RawSize: data.RawSize, Content: data.Content, FilePath: data.FilePath, Folder: data.Folder });
        }

        self.TotalSize = ko.computed(function () {
            var total = 0;

            if (self.Model.CurrentStep() === 5) {
                ko.utils.arrayFilter(self.Model.CurrentStep().Files(), function (item) {
                    total += item.RawSize;
                });
            }

            return total
        });

 <table id="FileList" class="table table-responsive table-striped">
            <thead>
                <tr>
                    <th>
                        @Html.DisplayName("Document Name")
                    </th>
                    <th style="width: 150px;">
                        @Html.DisplayName("Document Size (MB)")
                    </th>
                    <th style="width: 40px;">
                        @Html.DisplayName("View")
                    </th>
                    <th style="width: 40px;">
                        @Html.DisplayName("Delete")
                    </th>
                </tr>
            </thead>
            <tbody data-bind="template: { name: 'FileRowTemplate', foreach: Model.Step5.Files }"></tbody>
            <tfoot>
                <tr>
                    <td colspan="4">
                        @Html.DisplayNameFor(model => model.Size)
                        <span data-bind="text: TotalSize" />
                    </td>
                </tr>
            </tfoot>
        </table>

self.TotalSize 始终为 0。

请问我该如何解决这个问题？

解决方案：

按照 Chris Pratt 的建议，我改变了这个：

   if (self.Model.CurrentStep() === 5)

到 if (self.Model.CurrentStep().Files)

这解决了问题。

【问题讨论】：

标签： asp.net-mvc asp.net-mvc-4 knockout.js

【解决方案1】：

问题似乎出在这里：

if (self.Model.CurrentStep() === 5) {
    ko.utils.arrayFilter(self.Model.CurrentStep().Files(), function (item) {
        total += item.RawSize;
    });
}

如果self.Model.CurrentStep() 的类型等于5，那么它永远不可能有Files 成员，因为JavaScript 编号与Files 没有任何关系。换句话说，要么您的 if 语句错误，要么您过滤的数组错误。

也许你的意思是你的 if 语句是：

if (self.Model.CurrentStep().length === 5)

【讨论】：