Question

我有一个带有多个下拉菜单的屏幕。每个都通过web api调用填充。我在一个活跃的目录环境中。我正在使用Durandal SPA框架。

enter image description here

目前我在激活视图时加载下拉列表。 EG。

  activate: function (data) {
            var id = data.id || undefined;
            userRole(data.mode || 'usr');

            // i added this as i was thinking i dont need to initialize the "static" dropdowns every time
            // I'm testing my code without this as we speak.
            if (!hasBeenInit) {
                lookupInit(id);
                hasBeenInit = true;
            }
        },
   }

[A]似乎是随机的，取决于服务器负载量（我猜）我的下拉菜单不会填充 ..

[B]一些下拉菜单取决于另一个下降的价值。我已经通过使用淘汰订阅事件实现了这一点。并更新我的可观察集合。

的Javascript

userInfo.BuildingCode.subscribe(function (value) {
        vm.userInfo.FloorCode(undefined);
        http.get('api/Floor', { id: value }, false)
            .done(function (response) {
                console.log('api/Floor');
                vm.lookups.allFloors(response);
                console.log(vm.lookups.allFloors());
            });
    });

HTML

<select data-bind="options: lookups.allFloors, optionsText: 'FloorName', optionsValue: 'FloorCode', value: $root.userInfo.FloorCode"></select>

如果我必须选择建筑物值，例如，楼层下拉列表必须获得新值。 API调用确实发生了，似乎可观察数组得到更新，但值似乎没有反映在视图上。

Chrome控制台日志

api/Floor main-built.js:14
[Object, Object, Object]

api/Floor main-built.js:14
[Object, Object, Object]

api/Floor main-built.js:14
[Object, Object, Object, Object, Object]

我该怎么做才能确保每次调用都会填充查找/下拉列表。以及他们的执行顺序保持不变。

我尝试过这样的事情，但感觉不对。我还为durandal http助手添加了一个异步错误的重载，但它似乎没有用......任何想法？：\

   http.get('api/employmenttype')
            .done(function (response) {
                console.log('api/employmenttype');
                vm.lookups.allEmploymentTypes(response);
            })
            .then(function () {
                http.get('api/actionlist')
                    .done(function (response) {
                        console.log('api/actionlist');
                        vm.lookups.allActionListOptions(response);
                    })
                    .then(function () {  ... } );

更新

我调查了异步调用重载。结束是罪魁祸首，一旦我修复它，我的数据似乎不断加载。唯一的副作用是我的服务器端数据集都不是异步加载的。（我希望我不会被钉在十字架上）。

Answer 1

假设lookupInit是异步调用，请确保返回promise。所以activate就变成了一条线。

activate: function (data) {
    var id = data.id || undefined;
    userRole(data.mode || 'usr');

    // i added this as i was thinking i dont need to initialize the "static" dropdowns every time
    // I'm testing my code without this as we speak.
    if (!hasBeenInit) {
        hasBeenInit = true;
        return lookupInit(id);
    }
    return true;
},

我还在消化这个问题的其他部分，但我想这可能会让你开始。

更新：vm.userInfo.FloorCode的值重置为未定义，但在select中未定义optionsCaption: 'Please select...'。可能是ko不会更新选项值，因为它无法找到相应的值。

KO单页应用。异步数据调用随机失败/不绑定

1 个答案: