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