Question

我有一个页面，其中包含订阅者，其配偶和N个家属的信息。

对于每一个，我们要求他们的名字，dob，地址等。基本上，它是一遍又一遍的相同领域。我可以为订户和配偶创建一个模型。我总是有一个订阅者，我并不担心在我的模型中创建一个空的配偶节点，但对于孩子们，我不确定如何继续...

我的页面是一个非常长的页面，其中包含许多部分，这些部分将被隐藏，直到处理该部分为止 - 就像向导一样。

我当前页面的每个部分都以外部div开头：

<div data-bind="with: submodelName">  // i.e. subscriberInfo, spouseInfo

我只是不知道如何处理N个孩子。

我可以填写整个＆lt; div＆gt;＆lt; form＆gt;＆lt; / form＆gt;＆lt; div＆gt;部分为＆lt; script＆gt;标记并使其成为模板，但如何将不同的模型绑定到每个项目？即如何模拟“with：”部分？

我当前的模型设置是我有一个大的包装模型，我正在创建许多子模型（4 +一个为每个孩子）并调用一个applyBindings（）：

var masterPageModel = new PageViewModel(); // pulls in several other modules

    // ... pageViewModel.js contents::

    // *** section-specific models
    self.selectedCoverage = ko.observable();
    self.contactInformation = ko.observable();
    self.subscriberInformation = ko.observable();
    self.spouseInformation = ko.observable();
    self.dependentInformation = ko.observableArray(); // how will this work? array?

    $.getJSON("./load.php",{},function(modelPackage){

         // **** meta properties
         self.modelList(modelPackage.modelList);
         self.currentModel(modelPackage.currentModel);

         // models
         self.selectedCoverage(new SelectedCoverage(modelPackage.models["selectedCoverage"]));
         self.contactInformation(new ContactInformation(modelPackage.models["contactInformation"]));
         self.subscriberInformation(new SubscriberInformation(modelPackage.models["subscriberInformation"]));
         self.dependentInformation(new DependentInformation(modelPackage.models["dependentInformation"]));  // this isn't working
         // dependentInformation is an array of people and information....

    }); 

    //... back to first file:

ko.applyBindings(masterPageModel);

感谢。任何帮助将不胜感激。

Answer 1

如果我理解正确，你可以像这样使用if绑定：

<!-- ko 'if': valueIsWhatIAmLookingFor -->
<div data-bind='template: myTemplate'>
</div>
<!-- /ko -->

我逃脱了IE的'if'。

Answer 2

斯科特，不确定我完全理解，但这可能会有所帮助：

仅一个表格

一种方法是显示“依赖添加”按钮，用户要选择的从属名称列表，然后仅显示单个表单以编辑（或添加）所选的从属。请原谅我的伪代码，但是这样的话：

myModel = {
    myDependents = ko.observableArray(dependents);
    mySelectedDependentIndex = ko.observable(0);
    myActiveDependent = ko.computed(function(){ return myDependents()[mySelectedDependentIndex()];});
}

然后将表单绑定到模型的myActiveDependent计算的observable。

每个依赖的一个表单

另一种方法是使用foreach绑定。

myModel = {
    myDependents = ko.observableArray(dependents);        
}

myDependentModel = {
    name = ko.observable('someName');
}

<div id="dependentFormListContainer">
    <ul data-bind="foreach: myDependents">
        <li class="dependentForm">
            <input type="text" data-bind="value: name" />
        </li>
    </ul>
</div>

ko.applyBindings(myModel, $('#dependentFormListContainer')[0]);

同样，这都是伪代码，但希望这会指出你的解决方案。

knockoutjs - javascript数组到observableArray到模板 - 怎么样？

2 个答案:

仅一个表格

每个依赖的一个表单