Question

所以我创建了一个滚动控件，我希望在同一个视图模型中的两个不同位置使用它，例如： -

define(['common/viewmodels/controls/scroller-nav', 'common/viewmodels/controls/scroller-nav'],
     function(mainScrollNav, modalScrollNav))

        vm = {
            activate: activate,
            mainScrollControl: ko.observable(null),
            modalScrollControl : ko.observable(null)
        }

        return vm;

        function activate() {
            vm.mainScrollControl({ model: mainScrollNav, view: 'common/views/controls/mainScroll' });
            vm.modalScrollControl({ model: modalScrollNav, view: 'common/views/controls/modalScroll' });

            // load up the data that is to be used for each (should be independent)
            mainScrollNav.init();   
            modalScrollNav.init();
        }
    }
}

控件在填充mainScrollControl和modalScrollControl的两个实例上加载正常，但是，即使控件是单独定义的，也会共享数据（修改模式中的滚动条位置以及在主页面上也进行了修改）。似乎mainScrollNav和modalScrollNav链接到单个服务viewmodel而不是独立的viewmodel。我是采用这种方式还是应该使用别的东西？

Answer 1

解决方案不是创建一个viewmodel，而是视图模型的一个功能......

var control = function(){
     vm = {
         // Vars and functions
     }
     return vm;
}

return control;

然后只需通过调用define paramaters中传递的引用，就可以根据需要重复使用viewmodel。他们也都独立工作。

 define(['common/viewmodels/controls/scroller-nav'],function(scrollNav)){

 vm = {
     mainScroller: new scrollNav(),
     subPageScroller: new scrollNav()
 }

return vm;

Durandal：将相同的viewmodel（控件）定义为两个不同的变量

1 个答案: