knockout.js異步綁定更新

我在我的JavaScript視圖模型中使用Knockout代碼。一切都按照設計工作，除了當我的異步調用返回時，我努力讓雙向綁定更新工作。請參閱下面的代碼。knockout.js異步綁定更新

var ViewModel = function (counterparty, scenario) { 
this.counterparty = ko.observable(counterparty); 
this.scenario = ko.observable(scenario); 
this.choice = ko.computed(function() { 
    // Knockout tracks dependencies automatically. 
    //It knows that fullName depends on firstName and lastName, 
    //because these get called when evaluating fullName.   
    return this.counterparty() + " " + this.scenario(); 
}, this); 

this.loginResult = ko.observable(""); 
// Do an asynchronous request to a rest service 
var xmlhttp = new XMLHttpRequest(); 
var url = 'http://someloginurl'; 
xmlhttp.open('GET', url, true, 'user', 'pass'); 
xmlhttp.send(null); 

xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     var response = xmlhttp.responseXML; 
     this.loginResult = "Logged In To RNS Successfully"; 
    } else { 
     // wait for the call to complete 
    } 
}; 
this.availableCountries = ko.observableArray([ 
    new Country("UK", 20000), 
    new Country("France", 30000)]); 
this.selectedCountry = ko.observable(); 


}; 
var Country = 
function(name, population) { 
    this.countryName = name; 
    this.countryPopulation = population; 
}; 

ko.applyBindings(new ViewModel("", ""));

所以我需要這段代碼以更新綁定顯示的HTML this.loginResult新的價值......但是，這不會發生，我不知道爲什麼..

我以爲這一行 this.loginResult = ko.observable（「」）; 應確保該值是'雙向綁定'，但似乎不是。任何人都知道爲什麼這不會更新？

此HTML標記如下：

<p><span data-bind="value: loginResult"> </span></p> 

if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     var response = xmlhttp.responseXML; 
     this.loginResult = "Logged In To RNS Successfully"; 
    } else { 
     // wait for the call to complete 
    }

確定 - 我固定這個問題..的解決方案是重構代碼一點...

首先聲明變量前期作爲觀察到

// Do an asynchronous request to a rest service 
this.loginResult = ko.observable(''); 
var url = 'someurl'; 

then refactor the method and pass in the variable so that its defined. 
runAsyncRequest(url, this.loginResult); 

function runAsyncRequest(url, loginResult) { 
var xmlhttp = new XMLHttpRequest(); 
xmlhttp.open('GET', url, true, 'user', 'pass'); 
xmlhttp.send(null); 
xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     var response = xmlhttp.responseXML; 
     loginResult('Logged In To RNS Successfully'); 
    } else { 
     // wait for the call to complete 
    } 
};

}

所有作品，然後順順當當和雙正在更新。

來源

2012-11-28 The Unculled Badger

遺憾的是，答案結果在Microsoft JScript運行時錯誤：對象不支持屬性或方法'loginResult'。所以我從這裏假設異步響應無法找到DOM上的屬性？ –

要在觀察到的設定值，使用

this.loginResult("Logged In To RNS Successfully");

如果沒有括號，你分配一個字符串變量的loginResult，不填充數據了。

從觀測上的文件：（http://knockoutjs.com/documentation/observables.html）

To write a new value to the observable, call the observable and pass the new value as a parameter. For example, calling myViewModel.personName('Mary') will change the name value to 'Mary'.

來源

2012-11-28 11:48:19 sphair

好的 - 謝謝，讓我在正確的軌道上..看到上面的編輯 –

knockout.js異步綁定更新

回答

相關問題