は、私は次のSub-のviewmodelsとかなり複雑なビューモデルを持っている私のDOM

Question

をクリアしています私はASP.Net MVCで働いています）。私の見解では

は、私はこれをやっている：

<div class="tab-content transparent"> 
    <div class="tab-pane active" id="tab1"> 
    <div class="row"> 
     <div class="col-md-12 block employment" data-bind="with: self.employment"> 
     <div class="block-title"> 
      <h3>Your <strong>Employment</strong></h3> 
      <hr /> 
     </div> 

     <div class="checkbox"> 
      <label> 
      <input type="checkbox" data-bind="checked: self.isEmployed" /> Are you employed? 
      </label> 
     </div> 

     <!-- other markup taken off --> 

     </div><!-- .col-md-12 .block .employment --> 
    </div><!-- .row --> 
    </div><!-- .tab-pane --> 
</div><!-- .tab-content --> 

しかし、これは動作しません！ Chromeでページが読み込まれると、バインド後のすべてがDOMになくなってしまいます。ここにスクリーンショットがあります！

私は何をしないのですか？

Answer 1

あなたが最終的にbudgetCalculatorViewModelのインスタンスに結合している、あなたはwith: self.employmentを使用すべきではないと仮定すると、それだけでwith: employment次のようになります。

<div class="col-md-12 block employment" data-bind="with: employment"> 

あなたのモデルでは、selfは一方で、budgetCalculatorViewModelインスタンスを参照してバインディングのノックアウトでは存在しないインスタンス内でselfというプロパティを探します。結合withが動的に関連付けられた値がnull/undefinedか

とself.employmentが存在しないので、それはすべて削除されたか否かに応じて、子孫の要素を追加または削除します

：ことThe documentationリアクション内部要素。