0

我已经设法在网上找到单个计算项的示例,但是有没有人有一个简单的剔除网格的示例,其中一个字段是根据其他字段的值计算的?

编辑:这是我编写的一些代码,但我很确定到目前为止我的做法是错误的:

    <script type="text/javascript" src="@Url.Content("~/Scripts/knockout-2.1.0.js")"></script>
<script type="text/javascript">

    function QBRatingsViewModel() {
            var self = this;
            var baseUri = '@ViewBag.ApiUrl';
            self.qbratings = ko.observableArray();
            this.Interception = ko.observable();
            this.Gain = ko.observable();

            this.CalculatedRating = ko.computed(function() {        
                return this.Interception() * this.Gain();
            }, this);

            $.getJSON("/api/qbrating", self.qbratings);
    }

    $(document).ready(function () {
        ko.applyBindings(new QBRatingsViewModel());
    }); 

  </script>


<div style="padding-left: 10px;">
    <div id="divQBRatings" style="padding-left: 3px; width: 750px;">
        <table class="grid" cellspacing="0" cellpadding="0" id="QBRatingsGrid">
            <tr class="gridheader"><td style="width: 30px;">Id</td><td width="10" /><td style="width: 40px;">Season</td><td width="10" /><td style="width: 70px;">Team </td><td width="10" /><td style="width: 130px;">Completion </td><td width="10" /><td style="width: 190px;">Gain </td><td width="10" /><td style="width: 30px;">Touchdown </td><td width="10" /><td style="width: 30px;">Interception </td><td width="10" /><td style="width: 30px;">Rating</td><td width="10" /><td></td></tr>
            <tbody data-bind="foreach: qbratings" class="grid">
                <tr>
                    <td><span style="width: 30px;" data-bind="text: $data.Id"></span></td>
                    <td width="10" />
                    <td><span style="width: 40px;" data-bind="text: $data.Season"></span></td>
                    <td width="10" />
                    <td><span style="width: 130px;"data-bind="text: $data.TeamName"></span></td>
                    <td width="10" />
                    <td><span style="width: 190px;" data-bind="text: $data.Completion"></span></td>
                    <td width="10" />
                    <td><span style="width: 190px;" data-bind="text: $data.Gain"></span></td>
                    <td width="10" />
                    <td><span style="width: 190px;" data-bind="text: $data.Touchdown"></span></td>
                    <td width="10" />
                    <td><span style="width: 190px;" data-bind="text: $data.Interception"></span></td>
                    <td width="10" />
                    <td><span style="width: 190px;" data-bind="text: $data.CalculatedRating"></span></td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
4

1 回答 1

0

我不知道您计算的属性是否与项目或整个视图模型有关。如果它与项目有关,您应该执行以下操作:

$.getJSON("/api/qbrating", function (result) {
    ko.utils.arrayForEach(result, function (item) {
        item.CalculatedRating = item.Interception * item.Gain;
    });
    self.qbratings(result);
});

如果它与整个模型有关,您应该使用 $parent 而不是 $data:

<td><span style="width: 190px;" data-bind="text: $parent.CalculatedRating"></span></td>
于 2013-01-06T16:49:31.407 回答