【问题标题】:knockout,js: Iterating through a "strongly-typed" observableArray淘汰赛,js:遍历“强类型” observableArray
【发布时间】:2014-03-25 17:46:16
【问题描述】:

我创建了this fiddle 来说明我的问题。

我正在尝试在整个应用程序 (SPA) 中使用“强类型”对象。原因是我遇到了来自服务器的对象与运行时创建的对象之间存在差异的问题。尽管两者具有相同的属性,但缺少一些 CRUD 函数,在某些情况下,还缺少下拉列表的枚举。现在我发现我不能使用 foreach 绑定,因为我的 observableArray 没有元素,但在代码端它有。我在另一个 SPA 上做了类似的事情,但不同之处在于,我没有在所有属性上使用 ko.observable*。另一个工作得很好。 (编辑:我删除了属性上的 ko.observable 并且行为继续)。

应用程序有两个视图模型:AppViewModel 和 StrongViewModel。 AppViewModel 编排整个应用程序,而 StrongViewModel 是应用程序的子集。当用户想要运行一个进程时,choiceProcessId 被设置,然后它将进程中的数据加载到 selectedProcessData 中。 selectedProcessData 的所有结果都显示在一个表格中。

启动应用程序:

var app = new AppViewModel();
app.initialize();
ko.applyBindings(app);

加载第一个进程:

self.initialize = function () {
self.goToProcess(self.processes()[0]);
};

用户选择第二个进程(强类型)并通过回调 selectedProcessData 填充 goToProcess:

self.goToProcess = function (userProcess) {
    self.chosenProcessId(userProcess);
    self.chosenProcessData = ko.observableArray([]);

    if (userProcess.getPath) {
        if (userProcess.callback && typeof (userProcess.callback) === "function") {
            var arrayResult = userProcess.callback(this.createCallback, this.updateCallback, this.deleteCallback);

            for (var i = 0; i < arrayResult.length; i++) {
                self.chosenProcessData.push(arrayResult[i]);
            }

            alert(self.chosenProcessData().length);
        }
    }
};

我不确定为什么将属性变成 observables 会导致它停止工作。请帮忙?

谢谢!

【问题讨论】:

    标签: knockout.js


    【解决方案1】:

    您正在使用这一行解除 goToProcess 内部的 selectedProcessData(它与 dom 的连接)

    self.chosenProcessData = ko.observableArray([]);
    

    应该是的。

    self.chosenProcessData();
    

    最好去掉这条线和for循环,直接使用

    self.chosenProccessData(userProcess.callback(this.createCallback, this.updateCallback, this.deleteCallback));
    

    固定示例。

    http://jsfiddle.net/5KZun/

    【讨论】:

    • 感谢您的帮助!
    猜你喜欢
    • 2016-08-21
    • 1970-01-01
    • 1970-01-01
    • 2013-06-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多