1

我们正在用 Durandal 开发一个应用程序,我遇到了一些问题,由于某种原因无法找到一种方法来让它工作。

问题:我的主视图模型绑定上下文和小部件上下文是完全分开的。数据显示得很好,但它是静态的,我无法执行单击功能,例如添加任务、新任务列表等(父项是项目,$data 是小部件对象函数)。但是,如果我创建一个“新任务列表”,它的内容可以通过它的父级(小部件控制器)进行操作。我需要能够操纵显示的初始数据以及任何创建的列表(所有新创建的列表都可以添加任务,等等)。出于某种原因,我无法弄清楚如何做到这一点。

在项目视图标记数据列表中是一个小部件,调用如下:

<section data-bind="tasklists: { items: project.task_lists }"></section>

任务列表小部件视图是:

<!-- ko foreach: { data: settings.items } -->
<div data-bind="text: title" class="task-list-title"></div>
<div class="widget-task-list">
    <!-- ko foreach: { data: tasks } -->
        <li class="task-list-item">
            <input type="checkbox" class="task-list-checkbox" data-bind="checked: completed, attr: { id: 'task-check' + id() + $index() }">

            <label data-bind="text: title, attr: { for: 'task-check' + id() + $index() }"></label>
            <span data-bind="text: comment_count " class="comments-count"></span>

            <span class="pill assigned">
                <!-- ko if: assigned_to -->
                <span data-bind="text: assigned_to"></span>
                <!-- /ko -->
                <span> - </span>
                <!-- ko if: due_date -->
                <span data-bind="time: due_date"></span>
                <!-- /ko -->
            </span>

            <span data-bind="text: 'PROJECT TAG'" class="tag-teal"></span>
            <span data-bind="bootstrapPopover: {} " class="pill">Popover</span>
        </li>
    <!-- /ko -->

    <input type="checkbox" class="task-list-checkbox">
    <input data-bind="click: $data.enableTyping, value: $data.newTask" placeholder="Add a task to this list" type="text" class="add-task">
    <span data-bind="bootstrapPopover: {}, text: 'Unassigned' " class="pill"></span>
    <!-- <span data-bind="widget: { kind: 'popover' } "></span> -->
    <span data-bind="text: 'Due Date'" class="pill"></span>
    <div data-bind="visible: $data.isTyping" class="task-action-buttons-holder">
        <button class="button button-add" data-bind="click: $data.addTask, text: 'Add Task' "></button>
        <button class="button button-cancel" data-bind="click: '', text: 'Cancel' "></button>
    </div>
</div>
<!-- /ko -->

项目模型如下:

  return {
    activate: function(data) {
        var project_loading = cache.getItem('project', Number(data.id));
        var self = this;

        $.when(project_loading).done(function(project) {
            self.project = new Project(project);
            self.project.load();
        });

        return project_loading;
    }
};

最后是项目绑定上下文:

["Binding", "views/projects/single", Object]
0: "Binding"
1: "views/projects/single"
2: Object
__moduleId__: "viewmodels/projects/single"
activate: function (data) {
project: Project
__proto__: Object
length: 3
__proto__: Array[0]

我需要做的就是能够操作项目任务列表视图中的初始数据,并使项目和小部件的绑定上下文相同。这可能吗?我觉得我想多了。任何帮助是极大的赞赏。

4

0 回答 0