0

示例 jsFiddle

部分工作,我可以渲染对话框,添加 N 个提交并删除一个 - 但我无法编辑......


我创建了一个自定义绑定处理程序,它呈现一个显示子问题列表的 jQuery UI 对话框。一旦这些都完成并按下Save Changes按钮,它会使用 observable 的副本ko.toJS(observable)并将其添加到数组中,然后将其添加到observableArray我的视图模型中,就像这样。

var submission = [];
viewModel.selectedQuestion().subQuestions().forEach(function (sq) {
    submission.push(ko.toJS(sq));
});
viewModel.submissions.push(submission);

我已将一个函数附加到视图模型,以删除这样的给定提交。

viewModel.deleteSubmission = function (submission) {
    var index = 0;
    viewModel.submissions().forEach(function (s) {
        if (s === submission) {
            viewModel.submissions.splice(index, 1);
        }
        index++;
    });
};

但是我对如何编辑提交、使用给定模型再次渲染对话框感到有些困惑。我知道ko.renderTemplate并且目前正在尝试这条路线,但我认为ko.toJS我添加到我的提交数组中的副本正在阻止 Knockout 做它的事情。

有没有人有任何指示可以将我推向正确的方向?我目前正在阅读Knockout 中的一个简单的编辑器模式,因此我非常有信心在取消编辑对话框时可以处理所有commit问题rollback- 我只是不确定如何编辑已保存的提交。


尝试1:jsFiddle

我创建了第二个自定义绑定处理程序editSubmissionDialog,并将其添加selectedSubmission到我的视图模型中。这是打开对话框 - 但由于ko.toJS(我认为)传递给对话框的项目是不可观察的。另外,我真的必须创建另一个使用相同对话框的自定义绑定处理程序,希望不是。

4

2 回答 2

1

你绑定处理程序很奇怪,你从处理程序依赖于虚拟机。在此处查看我的对话框示例,该示例使用更通用的模板方法。

http://jsfiddle.net/H8xWY/107/

它使用 dialogItem 上的成员来告诉要加载哪个模板

this.dialogItem({ template: "dialog-template-one", message: "Dialog one data", title: "Databindable title" });

它使用我写的这个绑定集合中的对话框绑定 https://github.com/AndersMalmgren/Knockout.Bindings

于 2013-08-14T09:57:18.437 回答
0

工作的jsFiddle


设法以我喜欢的方式做到这一点,基本上我是.splice在给定索引处收集提交。

绑定

<div class="submissions" data-bind="foreach: { data: $root.submissions, as: 'submission' }">
    <table>
        <tbody data-bind="foreach: { data: $data, as: 'question' }">
            <tr>
                <td class="key" data-bind="text: question.text"></td>
                <td data-bind="text: question.answer"></td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td colspan="2">
                    <button data-bind="click: $root.deleteSubmission">Delete</button>
                </td>
            </tr>
        </tfoot>
    </table>
</div>

功能

self.deleteSubmission = function (submission) {
    var index = self.submissions().indexOf(submission);
    self.submissions.splice(index, 1);
};

提供的工作 jsFiddle中的更多详细信息。

于 2013-09-16T14:57:01.563 回答