0

如何在 knockout.js 中的 ajax 成功/错误后添加带有超时的更新消息？

我可以这样做：

var ViewModel = {
    var self = this;
    self.message = ko.observable("");
    self.setMessage = function(message, timeout){
        self.message(message);
        setTimeout(function(){
            self.message("");
        }, timeout);
    }
    .....
    $.ajax(url, {
        success: function(obj){
            self.setMessage(obj.message, 2000);
        }
    });
}

HTML：

<span data-bind='text: message()'></span>

但是我的网络应用程序中有很多带有 ajax 调用的 ViewModel，我希望能够在每个 ViewModel 中执行此操作，而且我不喜欢复制粘贴我的代码。

我需要帮助来扩展淘汰赛，以便我可以添加一个方法并将其导入到我的所有视图模型中。

4

2 回答 2

1

为什么不创建一个由其他 VM 继承的基本 VM，并创建一个其他 VM 可以调用的 ajax 函数。

看一下这个 ：

通过原型访问 viewModel 函数

于 2013-05-03T21:08:33.817 回答
0

感谢ajgiv，我能够使用上面的链接提出解决方案。如果我是唯一一个在 Web 应用程序上工作的人，并且如果视图模型的数量较少，我会采用上述方法。（我有一个 knockout.ext.js 类，其中包含应用程序所需的所有扩展程序）

所以我在我的 knockout.ext.js 中添加了这个函数：

ko.timeoutMessageModel = function(initialMessage){
    var self = this;
    self.message = ko.observable(initialMessage);
    self.setTimeout = function(msg, time) {
        self.message(msg);
        setTimeout(function(){
            self.message("");
        }, time);
    }
    return self;
}

在我的 ViewModel 中：

var message = ko.timeoutMessageModel("initialMessage");
$.ajax(url, 
    success: function(data){
        self.message.setTimeout(data.message, 1000);
    }
);

...在我所有的视图模型中等等！

HTML：

<data-bind="text: message.message()"/>
于 2013-05-03T21:35:19.250 回答