Javascript Durandal单击其他文件中的调用函数

我有一个主fileperiods.js，通过单击绑定自定义对话框打开：

periods.js

periods.html

我想通过单击“绑定”在该对话框中调用主文件的其他函数：

<button type="button" class="btn btn-success btn-lg btn-block" data-bind="click:$addFreeDay"><i class="fa fa-plus-circle fa-lg"></i>other new</button>

我尝试了很多想法：点击：addFreeDay，点击：addFreeDay，点击：$root.addFreeDay，点击：periods.addFreeDay，点击：$periods.addFreeDay，点击：$root.periods.addFreeDay

---

有时它给我一个错误，有时不是。我错了什么？

是否有相应的periods.html文件作为视图

在periods.html文件中，您可以使用标记，包括单击绑定。在periods.js文件后面的viewModel将包含单击的事件处理程序，您可以在这里调用对话框。这两个文件在Durandal和Aurelia中一起构成了一个MVVM单元

---

根据您的组合结构，您很可能会使用$data.addFreeDay.bind$data作为处理程序来访问函数。但是它也可以是$parent.addFreeDay.bind$parent或$root.addFreeDay.bind$root，这取决于您的结构。

感谢您的帮助，我尝试了这三种方法，它们在控制台中没有出现错误，但函数没有做任何事情。我在这里编辑了这个主题并添加了更多的代码，也许现在更容易帮助我。我仍然没有足够的代码来帮助你。很难判断您的ViewModel是单例还是实例。如果他们是单身，你需要确保你正在展示你试图访问的功能。如果它们是实例，则需要确保返回的是构造函数。我可以告诉您，在periods.html文件中，您应该将单击处理程序更改为单击：$data.openFreeDayDialog.bind$data。另外，addFreeDay.js在哪里？我没有addFreeDay.js，因为我认为它不是必需的。我知道这将不是一个干净的MVVM结构，但该文件将不仅仅具有一个函数。这里是periods.js:这里是periods.html是的，但这是你的问题。您可以拥有自己的视图，而不需要相应的viewModel。但是对话框功能创建了一个孤立的上下文。创建一个addFreeDay.js文件，将函数移到其中，然后在对话框上下文中将两者组合在一起。事实上，只有一个函数，或者可能只有一个函数，这并不是决定是否执行完整MVVM的一个合理标准。此时，您只需单击：addFreeDay或单击：$data.addFreeDay.bind$data。

[...]
<button type="button" class="btn btn-success btn-block" data-bind="click:$root.openAddFreeDayDialog"><i class="fa fa-plus-circle fa-lg"></i> new</button>
[...]

<div class="modal-content autoclose">
    <div class="modal-header">
        <h3 class="modal-title">freien Tag hinzufügen</h3>
        <small>Dauert der dieser freie Tag nur einen Tag  müssen Entdatum und Startdatum übereinstimmen</small>
    </div>
    <div class="modal-body">
        <form id="addFreeDay">
            <div class="form-group">
                <label for="dayName">Bezeichnung für diesen Tag </label>
                <input type="text" class="form-control" id="dayName">
            </div>
            <div class="form-group">
                <label for="dayStartDate">Anfagsdatum des Tages </label>
                <input type="date" class="form-control" id="dayStartDate">
            </div>
            <div class="form-group">
                <label for="dayEndDate">Enddatum des Tages </label>
                <input type="date" class="form-control" id="dayEndDate">
            </div>
        </form>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-success btn-lg btn-block" data-bind="click:$addFreeDay"><i class="fa fa-plus-circle fa-lg"></i>other new</button>
    </div>
</div>

<button type="button" class="btn btn-success btn-lg btn-block" data-bind="click:$addFreeDay"><i class="fa fa-plus-circle fa-lg"></i>other new</button>