0

我正在使用 RPNiemeyer kendo-knockout 库。我有三个相互实例化的视图模型——FranchiseDetailsViewModel实例化LanguageListViewModel哪个实例化LanguageDetailsViewModel。最后一个视图模型LanguageDetailsViewModel需要引用父视图，FranchiseDetailsViewModel因为它的功能取决于它。

html:

<div data-viewId="languageList" >
    <div id="languageList" data-bind="with: viewModel">
        <div id="languageListGrid" data-bind="kendoGrid: { data: languageViewModels, columns: [ 
                { 
                    field: 'Language', 
                    title: 'Language',
                    width: 50
                }

                ], 
            scrollable: false, sortable: true, pageable: false }" style="height: 380px">

        </div>
    </div>
</div>​

javascript

$(function () {

    var FranchiseDetailsViewModel = function () {
        var 
            self = this,
            initialize = function () {
                self.languagesInfoViewModel(new LanguageListViewModel(self));
                var parentViewModel = ({ viewModel: self.languagesInfoViewModel });
                var element = $('div[data-viewId="languageList"')[0];
                ko.applyBindings(parentViewModel, element);
            };

        FranchiseDetailsViewModel.prototype.languagesInfoViewModel = ko.observable();
        initialize();
    };

    var LanguageListViewModel = function (franchise) {
        var 
            self = this,
            initialize = function () {
                var languageViewModel = new LanguageDetailsViewModel(franchise);
                self.languageViewModels.push(languageViewModel);
            };
        LanguageListViewModel.prototype.languageViewModels = ko.observableArray([]);
        initialize();
    };

    var LanguageDetailsViewModel = function (franchise) {
        LanguageDetailsViewModel.prototype.Language = ko.observable("English");
       LanguageDetailsViewModel.prototype.franchise = franchise;
    };

    var initialize = new FranchiseDetailsViewModel();
});​

当网格绑定到源数据时，对父视图模型的这种引用会导致某种不定式循环。我收到Maximum call stack size exceeded错误。我相信当绑定到网格的源时，错误出现在 kendo 淘汰赛库中，因为如果我删除了网格，那么在这一行的 div 的淘汰赛绑定上就没有错误：

ko.applyBindings(parentViewModel, element);

这是此错误的真正原因吗？我该如何解决？我无法删除对父视图模型的引用，所以我希望在绑定到源数据时修复 kendo-knockout 行为。任何有关工作示例的帮助将不胜感激。谢谢。

http://jsfiddle.net/5Zkyg/43/

根据 Niemeyer 的评论更新：

我有一个 div，其中一些属性绑定到FranchiseDetailsViewModel. 这些属性之一代表一个复选框——命名它isVisible。我有另一个属性绑定到的 div LanguageDetailsViewModel。其中一些属性只有在选中复选框时才可见FranchiseDetailsViewModel。这franchise.isVisible是真的。这就是我需要特许经营参考的原因。

我对 javascript 比较陌生，也许我没有正确使用原型属性。当我使用new关键字实例化我的视图模型时，我发现在将其分配给原型时，它们变为公共的并且在标记中可见，因此我可以绑定它们。从您的示例中，我看到 this.myProperty 也公开了该属性。我不确定我的情况是否有所不同。

我决定用this.myData.parent = parent;它来解决我的问题。非常感谢您的反馈。

4

1 回答 1

1

根据上面的评论：

一种选择是“隐藏”特许经营权，这样 Knockout 就不会递归地尝试解开它。您可以通过使其成为函数的属性或可观察的（这是一个函数）来做到这一点。

有几种方法可以做到这一点：

var Child = function(parent) {

    //use parent directly from the argument passed to the constructor. available as part of the closure.
    this.myHandler = function() {
        parent.log();
    };        

    this.myData = ko.observable();

    //reference as a sub-observable. you can bind against myData.parent, but it will disappear when doing ko.toJS/ko.toJSON
    this.myData.parent = parent;


    //similar to sub-observable.  hide the actual value behind an empty function.  It will not be found when doing ko.toJS/ko.toJSON.
    this.parent = function() { };
    this.parent.value = parent;  
};

此处示例：jsfiddle.net/rniemeyer/uSpZB。

通常你不想在原型上放置可观察对象，因为它们将被所有实例共享。

于 2012-12-21T20:42:32.027 回答