我不能得到json对象。
我的目标是:
public class Person
{
public string firstName { get; set; }
public string lastName { get; set; }
}
PersonsControll:
public ActionResult Index()
{
return View();
}
// GET: /Persons/GetPerson
//[AcceptVerbs(HttpVerbs.Get)]
//[OutputCache(Duration = 0, VaryByParam = "*")]
public JsonResult GetPerson()
{
Person p = new Person { firstName = "Jonas", lastName = "Antanaitis" };
return Json(p, JsonRequestBehavior.AllowGet);
}
我的索引视图:
@Scripts.Render("~/bundles/knockout")
<p>First name: <strong data-bind="text: firstName"></strong></p>
<p>Last name: <strong data-bind="text: lastName"></strong></p>
<div id="dispJson"></div>
<script type="text/javascript">
var data = $.getJSON(".../GetPerson", function (result) {
//state = result.readyState;
firstName: result.firsName;
lastName: result.lastName;
})
.error(function () { alert("error"); });
function viewModel() {
ko.mapping.fromJS(data);
//state = data.readyState;
//firstName = data.firstName;
//lastName = data.lastName;
};
document.write(JSON.stringify(data)); //this line prints "{"readyState":1}"
ko.applyBindings(new viewModel());
</script>
当我在浏览器中找到“... / GetPerson”时,我会看到: 的 { “名字”: “乔纳斯”, “姓氏”: “Antanaitis”}
,但是当试图获取javascript视图时 - 我不会得到这些数据。
我做错了什么,为什么我无法获取数据? 评论代码的地方 - 我尝试了这种方法..但没有任何帮助。
我试过了:
*$.ajax({
type: "GET",
cache: false,
url: ".../GetPerson",
}).done(function (msg) {
alert("Data Saved: " + msg.readyState + " " + msg.firstName + " " + msg.lastName);
});*
然后警告框显示:“数据已保存:未定义Jonas Antanaitis ”
答案 0 :(得分:2)
您正在将异步代码与同步代码混合......您在这里有这一行
var data = $.getJSON(".../GetPerson", function (result) {
data
实际上是一个承诺(这是ajax返回的)。在回调执行之前,您实际上并没有数据 - 即结果是具有ACTUAL数据的东西。
您需要将绑定移动到INSIDE回调或使用您在事实之后设置的observable:
1)在回调示例
中<script type="text/javascript">
$.getJSON(".../GetPerson", function (result) {
function viewModel() {
return ko.mapping.fromJS(result);
};
ko.applyBindings(new viewModel());
})
.error(function () { alert("error"); });
</script>
2)使用可观察的
<script>
function viewModel() {
return { data: ko.observable() };
};
// Your html bindings will bind to data.* instead of just *
ko.applyBindings(new viewModel());
$.getJSON(".../GetPerson", function (result) {
data(ko.mapping.fromJS(result));
})
.error(function () { alert("error"); });
</script>
相应的html(带有绑定使它比if更干净):
<!-- ko with: data -->
<p>First name: <strong data-bind="text: firstName"></strong></p>
<p>Last name: <strong data-bind="text: lastName"></strong></p>
<!-- /ko -->
第二种方法的优点是你可以快速绑定所有内容......然后可以显示你的数据。