敲除：單擊綁定以添加/刪除層次結構中的項目

我想了解如何從敲除層次結構中調用添加/刪除功能。例如，如果我位於嵌套的foreach中，並且單擊了一個刪除按鈕，我該如何調用一個可以讓我刪除該項目的函數（並執行一些其他操作）？敲除：單擊綁定以添加/刪除層次結構中的項目

這是一個問題的小提琴。 https://jsfiddle.net/4a3z4urc/

在html中，註釋掉的按鈕有效，但我需要將該函數放在我的腳本標記中（這不起作用）。

function ViewModel(data){ 
    var self = this; 
    self.pages = ko.mapping.fromJS(data); 
    self.OutputJson = function(){ 
     console.log(ko.toJSON(self)); 
    } 

    self.removePage = function(pageName) { self.pages.remove(pageName) }; 
    self.removeRow = function(rowType) { self.pages.pageRows.remove(rowType) }; 
    self.removeSlide = function(slide) { self.slides.remove(slide) }; 
    self.addSlide = function(slide) {} 
}

我該如何讓RemoveRow和RemoveSlide函數刪除正確的項目？（Json在演示下面顯示）。謝謝！

來源

2016-06-23 Jennifer Michelle

你的問題是，在你的「內部」 remove方法，你沒有「當前選擇」頁面，pageRow，幻燈片的信息等

一個解決方案是在當前$parent傳遞到你的點擊處理程序：

<div data-bind="foreach: pageRows"> 
    <section style="border:1px solid pink; padding:5px;"> 

     <button type="submit" data-bind="click: $root.removeRow.bind($parent, $data)" 
      class="btn-delete"><i>&times;</i></button> 

    ... 
    </section> 
</div>

現在你可以在你的處理器與this訪問「當前選擇」頁：

self.removeRow = function(rowType) { this.pageRows.remove(rowType) };

演示JSFiddle。

請注意，如果您內部是多個foreach綁定，則還需要使用$root才能訪問「頂級」。

您也可以通過在$parent作爲放慢參數：root.removeRow.bind(null, $parent, $data)，在這種情況下你的手柄是這樣的：

self.removeRow = function(page, rowType) { page.pageRows.remove(rowType) };

你可以閱讀更多關於不同additional paramter passing options in the documentation.

來源

2016-06-23 12:30:21 nemesv

非常有幫助，謝謝！告訴我，使用挖空映射插件時是否可以添加幻燈片？我只能在頂層自己做。 –

即使使用映射插件，您也可以將新項添加到observablearray。你只需要識別當前頁面，pageRow等等，但是如果你想在一個單獨的問題中添加你打算如何做這件事的必要細節，那麼解釋這個就更好了。 – nemesv

此處添加的其他問題：http://stackoverflow.com/questions/37994245/knockout-add-items-into-nested-json-hierarchy –

敲除：單擊綁定以添加/刪除層次結構中的項目

回答

相關問題