Knockout.js 模态对话框 - 将视图模型元素传递给弹出窗口

Question

我在点击按钮时打开一个模式对话框。

 <input data-bind="click: review" class="button" type="button" value="review" />

点击按钮：

$('#divModal').dialog("open");

以下是我在文档中的代码。准备调用模式对话框。

$('#divModal').dialog({
            autoOpen: false,
            modal: true,
            width: 400,
            height: 700,
            buttons: {
                Close: function () {
                    $(this).dialog("close");
                }
            }
        });

在我的应用绑定中，我拥有可观察数组的所有值。 我将这些值绑定到我的表单中。 我想将相同的值传递给我的模式弹出窗口。

我在 html 中尝试了以下代码：

<div id="divModal">
            <section data-bind="visible: myCondition() === 'Readers'">
                <div>Readers List Goes here</div>
            </section>
             <section data-bind="visible: myCondition() === 'Writers'">
                <div>Writers List Goes Here</div>
            </section>
             <section data-bind="visible: myCondition() === 'Others'">
                <div>Others List goes here</div>
            </section>

</div>

myCondition 是一个可观察的数组。

我能够在 html 中显示它的值。 “Apply Bindigs”会处理这个问题。

我无法在模式对话框中显示其值。

我还有很多其他元素想要传递给这个模态对话框。

当模态对话框打开时如何调用函数 - 以便我可以将所有值传递给该函数？

有人可以帮我吗？

谢谢！

Answer 1

在 Knockout 中，您的 ViewModel 不应该知道 View。 ViewModel 是代表应用程序状态的纯粹数据结构，Knockout 确保 View 与它同步。 “将值传递给我的模式弹出窗口”的概念从根本上是错误的。您的模态状态 - 它显示的任何数据，以及它的打开/关闭状态 - 应该在您的模型中表示。打开对话框是设置一个可观察对象的问题。 binding handler（它是 Knockout 的扩展，而不是您的 ViewModel 的一部分）将处理相关的 DOM 操作。

考虑到这一点，您的问题简化为“如何将数据传递到模态反映的 ViewModel 部分？”如果不了解您是如何设置 ViewModel 的，这是不可能回答的。也许您已经制作了单独的 ViewModel 并且需要像 postbox 这样的通信。也许你的模态是component，你只需要设置它的params。