2

次のスクリプトがあります（以下を参照）。私はそれに関して2つの質問があります：

1.Knockoutjsのコンテキストで、次の行はどういう意味ですか？

ko.observable(null);

2.ここのようにまだ定義されていない関数を呼び出すにはどうすればよいですか？

that.activePollingXhr(...

完全なスクリプトは次のとおりです。

$(document).ready(function() {

    function ChatViewModel() {

        var that = this;

        that.userName = ko.observable('');
        that.chatContent = ko.observable('');
        that.message = ko.observable('');
        that.messageIndex = ko.observable(0);
        that.activePollingXhr = ko.observable(null);


        var keepPolling = false;

        that.joinChat = function() {
            if (that.userName().trim() != '') {
                keepPolling = true;
                pollForMessages();
            }
        }

        function pollForMessages() {
            if (!keepPolling) {
                return;
            }
            var form = $("#joinChatForm");


            that.activePollingXhr($.ajax({url: form.attr("action"), type: "GET", data: form.serialize(), cache: false,
                success: function(messages) {
                    console.log(messages);
                    for (var i = 0; i < messages.length; i++) {
                        that.chatContent(that.chatContent() + messages[i] + "\n");
                        that.messageIndex(that.messageIndex() + 1);
                    }
                },
                error: function(xhr) {
                    if (xhr.statusText != "abort" && xhr.status != 503) {
                        resetUI();
                        console.error("Unable to retrieve chat messages. Chat ended.");
                    }
                },
                complete: pollForMessages
            }));
            $('#message').focus();
        }

        that.postMessage = function() {
            if (that.message().trim() != '') {
                var form = $("#postMessageForm");
                $.ajax({url: form.attr("action"), type: "POST",
                    data: "message=[" + that.userName() + "] " + $("#postMessageForm input[name=message]").val(),
                    error: function(xhr) {
                        console.error("Error posting chat message: status=" + xhr.status + ", statusText=" + xhr.statusText);
                    }
                });
                that.message('');
            }
        }

        that.leaveChat = function() {
            that.activePollingXhr(null);
            resetUI();
            this.userName('');
        }

        function resetUI() {
            keepPolling = false;
            that.activePollingXhr(null);
            that.message('');
            that.messageIndex(0);
            that.chatContent('');
        }

    }

    //Activate knockout.js
    ko.applyBindings(new ChatViewModel());

});
4

2 に答える 2

3

nullこれは、初期値としてオブザーバブルを初期化するだけです。

監視可能な関数を呼び出す必要がある場合は、2 番目の括弧のセットを追加するだけです。

that.activePollingXhr()()
于 2013-03-11T13:05:17.170 に答える
3

  1. ko.observable(null);の値を持つオブザーバブルを作成しますnull。ko.observable(5);値が となる と何ら変わりはありません5。

  2. that.activePollingXhrajax呼び出しの結果を渡すことで、オブザーバブルを使用していることがわかります。ただし、この呼び出しは非同期であり$.ajax、サーバーから取得したデータを返すのではなく、遅延された jquery を返します。that.activePollingXhrコールバックを使用する必要がありsuccessます。コードは次のようになります。

    $.ajax({url: form.attr("action"), type: "GET", data: form.serialize(), cache: false,
    success: function(messages) {
        console.log(messages);
        for (var i = 0; i < messages.length; i++) {
            that.chatContent(that.chatContent() + messages[i] + "\n");
            that.messageIndex(that.messageIndex() + 1);
        }
        that.activePollingXhr(messages); // <-- Note where the call to activePollingXhr is
    },
    error: function(xhr) {
        if (xhr.statusText != "abort" && xhr.status != 503) {
            resetUI();
            console.error("Unable to retrieve chat messages. Chat ended.");
        }
    },
    complete: pollForMessages
});

あなたの質問の下のコメントについてthat.activePollingXhr は、次のように定義されていますthat.activePollingXhr = ko.observable(null);- の値を持つオブザーバブルnull。

于 2013-03-11T13:06:43.900 に答える