引用组件

在节点中使用knockout.js，如何获得从模板调用的子VM组件的引用？

插图

我有一个问题模型，虚拟机，包含一个自定义的资源组件，它与各自的模型和虚拟机。 资源虚拟机注册一个自定义组件，并接收一个资源模型对象作为参数，由父问题模型构build。 这个构造的资源作为parameter passing给模板：

QuestionModel.js

this = new QuestionModel(...); this.resource = new ResourceModel(some data); 

问题-template.html

 <div data-bind="foreach: { data: questions, as: 'question' }"> <!-- question related --> <resource params="resource: question.resource"></resource> </div> 

ResourceVM.js

 define(function(require, exports, module) { var ko = require('knockout'); var ResourceViewModel = function ResourceViewModel(params) { this.resource = params.resource; this.somethingSpecific = function() { return 'some value manipulate from this model'; } } ko.components.register('resource', { viewModel: { createViewModel: function(params, componentInfo) { return new ResourceViewModel(params); } }, template: { require: 'text!/resource-template.html' } }); return ResourceViewModel; }); 

我想能够调用资源虚拟机的function（如question.resourceVM.somethingSpecific（））。

获得组件子的引用的正确方法是什么？

我能想到的唯一的解决scheme是传递父对象的参数，并从孩子，这显然是不好的。

Answer 1

您的QuestionModel已经可以访问this.resource ，所以前进的方式可能是通过数据模型来完成，而不是通过视图模型。 将somethingSpecific()作为QuestionModel或ResourceModel一个属性而不是ResourceViewModel可以很好地解决问题。

我认为操纵数据是拥有它的实体的责任。 ResourceViewModel的工作只是在数据模型和DOM之间提供粘合。

 var QuestionModel = function QuestionModel() { this.somethingSpecific = function somethingSpecific() { this.resource.doStuff(); }; }; this = new QuestionModel(); this.resource = new ResourceModel(some data); 

然后，您可以让您的resource组件访问question而不是子resource ：

 var ResourceViewModel = function ResourceViewModel(params) { this.question = params.question; this.resource = this.question.resource; }