1

json オブジェクトを取得できません。

私の目的は：

public class Person
{
   public string firstName { get; set; }
   public string lastName { get; set; }        
}

人物管理:

    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」に移動すると、次のように表示されます: {"firstName":"Jonas","lastName":"Antanaitis"}

、しかし、ビューでデータウィッチJavaScriptを取得しようとすると、このデータを取得できません。

私が間違っていること、なぜデータを取得できないのですか? コメントされたコード - 私はこのアプローチを試しました..しかし、何も役に立ちませんでした。

私は試した：

*$.ajax({
    type: "GET",
    cache: false,
    url: ".../GetPerson",        
}).done(function (msg) {
    alert("Data Saved: " + msg.readyState + "  " + msg.firstName + "  " + msg.lastName);
});*

次に、警告ボックスに次のように表示されます。

4

1 に答える 1

2

非同期コードと同期コードを混在させています...ここにこの行があります

var data = $.getJSON(".../GetPerson", function (result) {

data実際には a promise になります (これは ajax が返すものです)。コールバックが実行されるまで、実際にはデータはありません。つまり、結果は実際のデータを持つものです。

バインディングをコールバックの内側に移動するか、事後に設定したオブザーバブルを使用する必要があります。

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 (with バインディングは 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 -->

2 番目の方法の利点は、すべてをすばやくバインドし、データが入ってくるとすぐに表示できることです。

于 2013-01-31T07:29:53.473 に答える