KO 网格显示问题，调整网格大小时显示一行。还包括图像

使用以下内容。

1) 视觉工作室 2012。 2）热毛巾模板。 3）下载ko grid及其CSS。

首页.html

<section id="alerts-view" class="view">
 <header>
        <a class="btn btn-info btn-force-refresh pull-right" 
            data-bind="click: refresh" href="#"><i class="icon-refresh"></i> Refresh</a>
        <h3 class="page-title" data-bind="text: title"></h3>
        <div class="article-counter">
            <address data-bind="text: alerts().length"></address>
            <address>found</address>
        </div>
    </header>
    <div  data-bind="koGrid: gridOptions"></div>
  </section>

home.js

define(['services/datacontext', 'durandal/plugins/router'],
    function (datacontext, router) {

        var alerts = ko.observableArray();
        isAttachedToView = ko.observable(false);

        var activate = function (routeData) {
            if (routeData.id == undefined)
                return datacontext.getAlerts(alerts);
        };

        var deactivate = function () {
            isAttachedToView(false);
            alerts([]);
        };

        var refresh = function () {
            return datacontext.getAlerts(alerts);
        };


       var vm = {
            activate: activate,
            deactivate: deactivate,
            refresh: refresh,
            alerts: alerts,
            gridOptions: {
                            data: alerts,
                            canSelectRows: true,
                            enableColumnResize: true,
                            footerVisible: true,
                            displaySelectionCheckbox: true,
                            enableSorting: ko.observable(true),
                            columnDefs: [
                                            { field: 'efficency', displayName: 'Green or C02 Bus' } ......................

                                        ]

                           },
            isAttachedToView: isAttachedToView,
            title: 'Current Alerts'
        };
       return vm;


       function viewAttached() {
           isAttachedToView(true);
           return true;
       }
    });

捆绑配置。

bundles.Add(
new StyleBundle("~/Content/css")

//.Include("~/Content/ie10mobile.css")
//.Include("~/Content/bootstrap.css")
//.Include("~/Content/bootstrap-responsive.css")
//.Include("~/Content/font-awesome.css")
//.Include("~/Content/durandal.css")
.Include("~/Content/toastr.css")
//  .Include("~/Content/app.css")
.Include("~/Content/KoGrid.css")
//  .Include("~/Content/jquery-ui-1.9.1.custom.css")

);

Second Picture I have no idea on what's going wrong or what i am doing wrong here, but looks like the following 2 pictures.

首先看不到任何网格。 调整窗口大小，您会看到网格，但只有一行。 尝试在 G 绿色巴士上分组，然后当您想让山口变大时，第二座山口开始移动，而不是第一个山口。

有没有一些可以与 Hottowel 模板和 kogrid 一起使用的东西或示例，我可以下载和使用？

看起来像一个小学生的错误，但很难找到和解释。

我也面临着这个问题。 奇怪的是，似乎viewport div（由kogrid生成的类名为kgViewport) 设置为固定高度 20 px。

作为解决方法，我让 jQuery 帮我修复了这个问题（我的视图模型中的最后一行）：

$("div.kgViewport").css("height", "inherit");