7

私はノックアウトに非常に慣れていないので、ノックアウトのメリットを享受したいjqueryモバイルアプリを作成しています。私は最後の日を非常に単純な問題のために壁に頭をぶつけて過ごしました..それ以来、コードを削除し、手動でバインドしました（したがって、jqueryでKOを使用する目的をほぼ無効にしました）。誰かが私がKOの本当の力を使わなければならないものを変える方法を私に教えてくれるかもしれません、そしてそれは私が構築するための素晴らしいポイントになるでしょう。私が見つけたコード例は、常にこれよりもはるかに複雑な問題（配列などの処理）に対するものでした。

私のJSON：

{"id":9,"fullName":"John Doe","firstName":"John","lastName":"Doe","referenceNumber":"BUY-08","position":"Buyer","type":"Buyer","telephone":"028 82 240780","email":"m@email.com","departmentId":3,"departmentName":"DEPT B","country":"United Kingdom"}

私のHTML：

 <div>
    Full Name: <input data-bind="value: fullName" disabled="disabled"/> <br />
    Ref: <input data-bind="value: reference" disabled="disabled"/> <br />
    Position: <input data-bind="value: position" disabled="disabled"/> <br />
    Email: <input data-bind="value: email" disabled="disabled"/> <br />
    Dept: <input data-bind="value: departmentName" disabled="disabled"/> <br />
    Country: <input data-bind="value: country" disabled="disabled"/> <br />
</div>

私のJavascript：

$(document).ready(function () { 

    function DetailsViewModel() {
        var self = this; 
        self.fullName = ko.observable("");
        self.reference = ko.observable("");
        self.email = ko.observable("");
        self.position = ko.observable("");
        self.departmentName = ko.observable("");
        self.country = ko.observable("");

        var success = function (data) {
            self.fullName(data.fullName);
            self.reference(data.referenceNumber);
            self.email(data.email);
            self.position(data.position);
            self.departmentName(data.departmentName);
            self.country(data.country);
            $.mobile.loading('hide');
        };

        webAPICall("api/user/getcurrentuser",
            "GET", success); // simple wrapper I'm using for ajax calls

    } 
    ko.applyBindings(new DetailsViewModel()); 
});

どんな助けでも大歓迎です、ありがとう！

4

1 に答える 1

5

ビューモデルに追加の関数や計算が必要ない場合、マッピングプラグインの使用は非常に簡単です。JSON を ko.mapping.fromJS に渡すだけです。

var viewModel = {};

function success(data) {
    viewModel = ko.mapping.fromJS(data);
    ko.applyBindings(viewModel);
}
webAPICall("api/user/getcurrentuser", "GET", success);

fromJSデータが JS オブジェクトで、fromJSONJSON 文字列の場合は関数を使用します。data-bindまた、属性と属性に同じプロパティ名があることを確認してくださいjson。

これが実際の例です：http://jsfiddle.net/axrwkr/5t5fj/50/

于 2012-11-29T14:27:42.277 に答える