与迪朗达尔/ HotTowel模板整合koGrid(Integrate the koGrid wit

我在与迪朗达尔模板一个asp.net的解决方案工作。

我尝试使用koGrid（ https://github.com/Knockout-Contrib/KoGrid ），这是淘汰赛兼容。当插入该网格由迪朗达尔管理的测试页，它不工作：电网似乎是有，但无法正确显示。

我们注意到，如果我们调整窗口的大小，那么，网格正确调整。

有没有人已经成功在迪朗达尔/ HotTowel模板整合这koGrid？

步骤来重现问题：

下面是含有少量的ASP.NET MVC项目来重现问题一个zip： https://www.dropbox.com/s/15rphyhkqp1h8py/KOGrid-HotTowelTemplate.zip

谢谢你的帮助。

Answer 1:

这应该被认为只是一种解决方法！适用于Durandal.Core 1.2 koGrid-2.1.1.js。 如果任何改变来解决这个问题，我会更新帖子。

在您的视图模型添加viewAttached（）函数（请务必将其添加到您的对象文本）像这样：

function viewAttached() {
    logger.log('Home View Attached', null, 'home', true);
    $(window).trigger('resize');
    return true;
}

在viewAttached功能后的组合物发生结合，并且触发器将使koGrid更新其宽度/高度可观测量。 koGrid监听此事件。

注：还有与HotTowel模板，你将需要解决CSS冲突。该SPA对身体标记使用18像素的字体大小。另外，面板复选框都应该被隐藏起来，与引导CSS可能发生的冲突。

以前的解决方案将确保网格显示，但是，排序不会至少对我来说工作。作为mikekidder问题的核心上述评论是，“当KOGrid执行其在迪朗达尔/ HotTowel绑定，KOGrid元件是尚未DOM的一部分”。你需要确保KOGrid没有做它的结合直到视图附后。这是可以实现如下：

1）添加新的可观察到的视图模型来保存是否视图已经通过迪朗达尔附着或不是一个布尔值：

isAttachedToView = ko.observable(false)

并将其公开

isAttachedToView: isAttachedToView

2）截至日期viewAttached回调函数被调用时，它是真实的：

function viewAttached() {
    isAttachedToView(true);
    logger.log('viewAttached');
    $(window).trigger('resize');
    return true;
}

3）环绕与劫你的HTML if语句，以确保HTML的该位不计算（即kogrid不会做它的结合），直到视图附后：

<!-- ko if: isAttachedToView() -->
    <div data-bind="koGrid: { data: ...

<!-- /ko -->

4）复位isAttachedToView是有关禁用视图假

function deactivate() {
    isAttachedToView(false);
}

和揭露这个：

deactivate: deactivate

此更新适用于迪朗达尔2.X

与迪朗达尔2.0开始，有指定应推迟到组成完全绑定的方式。

对于kogrid正常工作，这是需要的所有是执行这行代码为迪朗达尔框架初始化的一部分：

composition.addBindingHandler('koGrid');

该composition在该实施例中的变量是到迪朗达尔组成模块的引用。

更多信息请参见文档： http://durandaljs.com/documentation/Interacting-with-the-DOM.html

文章来源: Integrate the koGrid with the Durandal/HotTowel template