ノックアウト：HTMLテンプレートのviewmodelインスタンスへのアクセス

Question

私は、以下のようにビューモデルと関連テンプレートを持っています。

var AilmentItem = function() { 
    this.SelectedAilment = ko.observable(); 
} 

function AilmentsViewModel() { 
    this.Ailments = ko.observableArray([new AilmentItem()]); 
    this.AilmentsType = ko.observableArray([{ Name: 'Diabetes' }, { Name: 'Arthritis' }, { Name: 'High BP'}]); 
} 

ドロップダウンとして私は、列のいずれかにAilmentsTypeをバインドする必要があるHTMLテンプレートのHTMLスクリプト

<script type="text/javascript"> 
    $(function() { 
     var AilmentsVM = new AilmentsViewModel(); 
     ko.applyBindings(AilmentsVM, $('#Ailments')[0]); 
    }); 
</script> 
<div id="Ailments"> 
    <div> 
     <table> 
      <tbody data-bind='template: { name: "ailmentRowTemplate", foreach: Ailments }'> 
      </tbody> 
     </table> 
    </div> 
</div> 
<script type="text/html" id="ailmentRowTemplate"> 
    <tr> 
     <td><select data-bind="options: AilmentsVM.AilmentsType(), optionsText: 'Name', value: SelectedAilment"></select></td> 
    </tr> 
</script> 

。誰かが私にそれを達成する方法を導くことができますか？ありがとう。

Answer 1

AilmentsVMにはグローバルスコープがありません.jQueryのreadyブロックで作成されているため、データバインドで直接アクセスすることはできません。

1.3ベータ版を使用している場合は、ノックアウトが提供する$rootまたは$parent特殊変数を使用できます。この場合、トップレベルのスコープのレベルが1つだけであるため、同じになります。だから、ちょうど：$root.AilmentsType。

以前のバージョンを使用している場合は、templateOptions機能を使用してjQueryテンプレートにオプションを渡すことができます。それは次のようになります。

<tbody data-bind='template: { name: "ailmentRowTemplate", foreach: Ailments, templateOptions: { types: AilmentsType } }'> 
</tbody> 

を次に、それが好きアクセス：

<select data-bind="options: $item.types, optionsText: 'Name', value: SelectedAilment"></select>