knockout.js從JavaScript庫加載小部件

我正在嘗試將小部件添加到使用淘汰賽的現有應用程序中。這個小部件的文檔相當稀少。該文檔指示我將knockout.js從JavaScript庫加載小部件

<script>Widget.insertWidget({"productId":"1234"});</script>

放到我希望小部件顯示的頁面中。

該項目使用HAML，我已經能夠獲得例如通過做工作，則下列

%div 
    :javascript 
    Widget.insertWidget({"productId":"1234"})

該開始工作的例子，但我需要有productId，這是一個屬性在淘汰賽觀察。

所以我試圖實現綁定，這就是我卡住的地方。我試過的

%div{ 'data-bind' => "(text|html|value) => $parent.widgetInserter" }

變化在哪裏widgetInserter是

widgetInserter: => 
    Widget.insertWidget({"productId":@product().id})

我能打到我insertWidget函數內部debugger聲明，但沒有顯示小部件。

對我來說，這似乎應該有一個工作，但沒有。我很欣賞這方面的任何指導。

來源

2016-04-26 Joe Forsythe

'「（text | html | value）=> $ parent.widgetInserter」' - 爲什麼你在這裏使用'=>'？在淘汰賽中你需要使用'：'。在這裏，我想你需要自定義綁定來執行你的功能。見http://knockoutjs.com/documentation/custom-bindings.html –

如果不能從其它<script>訪問相同的敲除視圖模型，則產品ID綁定到一個隱藏的輸入：

<input type="hidden" data-bind="value: productId" id="pid" />

再後來訪問它：

%div 
    :javascript 
    var productId = document.querySelector('#pid').value; 
    Widget.insertWidget({"productId": productId})

來源

2016-04-28 06:19:40 Neps

這實際上是一個非常聰明的想法。我最終找出了基於'Widget'對象內部的解決方法，但這將是一個不錯的解決方案。謝謝！ –

knockout.js從JavaScript庫加載小部件

回答

相關問題