敲除虛擬撰寫與視圖模型構造

我有使用3雙視圖的虛擬基因敲除撰寫有些奇怪的功能/的ViewModels敲除虛擬撰寫與視圖模型構造

autoAttendant.js

define(['durandal/app', 'viewmodels/settings/autoAttendant/menu'], function(app, Menu){ 

    return function() { 
     var self = this; 

     self.attendant = ko.observable(); 

     self.activate = function() { 
      self.autoAttendant(new Menu()); 
     }; 
    }; 
});

autoAttendant.html

<div id="content_pane" class="pushed_right"> 
    <div class="content_box"> 
     <h1>Attendant</h1> 

     <!-- ko compose: 'viewmodels/settings/autoAttendant/menu' --><!--/ko--> 

    </div> 
</div>

menu.js

define(['durandal/app', 'viewmodels/settings/autoAttendant/menuItem'], function(app, MenuItem) { 

    return function() { 
     var self = this; 

     self.menuItems = ko.observableArray([ 
      new MenuItem('val1', 'label1'), 
      new MenuItem('val2', 'label2'), 
      // etc... 
     ]); 
    }; 
});

個

menu.html

<div class="list"> 
    <div class="box_item master"> 
     <!-- html content --> 
    </div> 
    <!-- ko foreach: { data: menuItems } --> 
     <!-- ko compose: 'viewmodels/settings/autoAttendant/menuItem' --><!--/ko--> 
    <!-- /ko --> 
</div>

menuItem.js

define(['durandal/app'], function(app) { 
    var menuItem = function(val, label, active) { 
     var self = this; 

     console.log('val:', val, 'label:', label, 'active:', active); // purely for testing purposes 

     var _val = val || 'default_val', 
      _label = label || 'default_label', 
      _active = active || false; 

     self.val = ko.observable(_val); 
     self.label = ko.observable(_label); 
     self.active = ko.observable(_active); 
    }; 
    return menuItem; 
});

menuItem.html

<div class="level"> 
    <div class="box_item clickable"> 
     <!-- html content --> 
    </div> 
</div>

連同這些代表顯示菜單和菜單的子項設置中的單個頁面。

菜單和菜單項必須從菜單本身是遞歸的菜單和ViewModel中分離出來，並且菜單項可以鏈接到帶有自己菜單項的子菜單。

問題出現在第二個ko compose。該console.log發生3次和第2它顯示在menu.js正確傳遞參數的構造函數菜單項：

val: val1 label: label1 active: undefined

在最後console.log打印出來，已經過去了的參數會被覆蓋樣所以：

val:  label: Object {model: "viewmodels/settings/autoAttendant/menuItem", bindingContext: L.b.z, activeView: null} active: undefined

爲什麼會出現這種情況？

來源

2013-04-12 sr-ix

你嘗試之前檢查你的菜單項的運行foreach循環？沿線 '' '<！ - ko foreach：{data：menuItems} - >' – RainerAtSpirit

Next thought ：如果menuItem本身沒有問題，那麼這裏是Durandal源代碼中的'ko.compose'。 https://github.com/BlueSpire/Durandal/blob/master/App/durandal/composition.js#L284 圍繞https://github.com/BlueSpire/Durandal/blob/master/App/durandal/設置斷點composition.js＃L229應該有助於澄清事情。 – RainerAtSpirit

我在'ko foreach'之前和之後放置了menuItems toJSON的span，menuItems格式正確。因此，切換到組合的menuItem上下文時，這些值會丟失或被覆蓋。 –

下工作，深入研究後，到源和（超過）實驗一點點：

從Durandal docs on compose

來源

2013-04-15 14:25:03

現在你已經知道它是有道理的。已經有ko.observable'menuItems'，它包含所有'New MenuItem（...）'，所以定義視圖就是需要的。甚至不知道Durandal是那麼聰明，謝謝分享。 – RainerAtSpirit

敲除虛擬撰寫與視圖模型構造

回答

相關問題