0

我正在构建一个 Durandal 应用程序,我目前正在处理的视图有两个<select>框。我将它们都绑定到 ako.observableArray并将它们的值绑定到 anotherko.observable如下:

<select data-bind="options: dateOptions, optionsText: 'display', value: selectedDate></select>
<select data-bind="options: buyerOptions, optionsText: 'display', value: slectedBuyer"></select>

第二个取决于第一个的值,所以我在不同的时间填充它们。首先,我在activate()调用期间查询我的数据源,然后在请求返回的承诺得到解决时将数据传递给单独的方法以填充数组数据(以简单的 JS 对象的形式):

var populateDateOptions = function(dates) {
    $.each(dates, function() {
        dateOptions.push({
            display: dateToString(this.pbDateOpt),
            date: this.pbDateOpt
        });
    });
};

效果很好 -<select>呈现视图时为我准备好了值。但是,在那之后,我无法<select>响应它们各自可观察数组的变化。一旦在 first 中选择了一个值,next<select>就会以几乎相同的方式填充<select>,我可以验证该buyerOptions数组确实正在填充,但<select>不会改变。我还尝试<select>通过开发工具将对象推送到其数组中,从而为第一个添加一个值,并获得相同的结果:数组已更新,但 UI 没有更改。

我在其他几个应用程序中使用了“选项”绑定,以前从未遇到过这个问题,但这是我的第一个 Durandal 应用程序,所以我想知道是否可能缺少一些东西?

谢谢!

更新 我在视图中添加了一些更多的绑定元素,但它们都没有工作,所以作曲家一定有一些奇怪的事情发生。不知道从哪里开始寻找问题(视图模型和视图在结构上与另一对工作正常的非常相似)。有小费吗?

4

2 回答 2

0

通过在 main.js中设置打开 Durandal 的调试模式system.debug(true)帮助我发现了一些没有通过控制台警告出现的代码错误。解决这些问题后,一切都绑定/正常工作。

经验教训 - 在开发时保持调试模式!

于 2013-06-20T13:18:17.800 回答
0

仅作为参考,这不是 Durandal 问题 - 这是 Knockout 问题。

此外,我发现最有效的一种方法是采用与您相同的方式 -

<select data-bind="options: dateOptions, optionsText: 'display', value: selectedDate></select>
<select data-bind="options: buyerOptions, optionsText: 'display', value: selectedBuyer"></select>

但是在您的视图模型中,让buyerOptions 直接依赖于dateOptions,就像这样-

var buyerOptions = ko.computed(function () {
    var opts = ko.observableArray();
    if (!selectedDate()) { opts.push(display: '<Select a Date>'); }
    else { opts(getBuyersOptions(selectedDate().id()); }
    return opts;
});

这样,如果您的 selectedDate 可观察对象为空(尚未选择一个),则不会出现买家选项,但如果您选择一个日期,它将根据 selectedDate 中的某个值(如 Id)填充它。It will also automatically update whenever a new date is chosen, without you having to explicitly tell it to with JavaScript or w/e

于 2013-06-19T19:08:11.797 回答