2013-02-28 3 views
8

マッピングプラグインで生成された配列に計算オブザーバブルを手動で挿入することはできますか?ここでは、マッピングプラグインを使用しない例がありますが、それを使用できるかどうかを知りたいと思います。ko.mappingプラグインで生成されたobservableArrayにノックアウト演算オブザーバブルを挿入

私は、サーバーからJSONデータを持っているとしましょう:私の見解では

[{ 
    "OrderID":1, 
    "FirstName":"Bill", 
    "LastName":"Smith", 
},{ 
    "OrderID":2, 
    "FirstName":"Jeff", 
    "LastName":"Evans", 
} 
{ 
    "OrderID":3, 
    "FirstName":"Dan", 
    "LastName":"Johnson", 
}] 

私はOrderクラスとビューモデルを持っている:

function Order(order) { 
    var self = this; 
    self.OrderID = ko.observable(order.OrderID); 
    self.FirstName = ko.observable(order.FirstName); 
    self.LastName = ko.observable(order.LastName); 

    /*This is what I want to insert after the mapping plugin 
    generates "orders on the ViewModel*/ 
    self.FullName = ko.computed(function() { 
     return self.FirstName() + ' ' + self.LastName(); 
    }); 

} 

function ViewModel() { 
    var self = this; 
    self.orders = ko.observableArray([]) 

//Get orders 
    $.ajax({ 
    url: '@Url.Action("orders")', 
    type: "post", 
    success: function (data) { 
     var mappedOrders = $.map(data, function (item) { return new Order(item) }); 
     self.orders(mappedOrders); 
    } 
    })  
} 

はにマッピング・プラグインを使用することが可能ですビューモデルでorders配列を生成し、計算された観測可能な "FullName"をorders配列に挿入することができますか?

答えて

4

あなたがすることができ、documentationによると:

var mapping = { 
    'children': { 
     create: function(options) { 
      return new myChildModel(options.data); 
     } 
    } 
} 

var myChildModel = function(data) { 
    ko.mapping.fromJS(data, {}, this); 

    this.nameLength = ko.computed(function() { 
     return this.name().length; 
    }, this); 
} 

var viewModel = ko.mapping.fromJS(data, mapping); 
+0

ありがとうございました、これは役に立ちます。しかし、データの1つのプロパティ(つまり、children - > nameLength)から計算された観測値を作成する方法は、この方法からしかわかりません。 2つ以上のプロパティから計算された観測値を作ることはどのように可能ですか? –

+0

申し訳ありませんが、私は昨夜外出していましたので、今まであなたのフォローアップの質問を見ていませんでした。あなたはそれが最後にソートされてうれしいです。技術的には、私はあなたが完全に尋ねた質問に答えたと言いたいので、アップヴォートがそれほど受け入れられないと思ったでしょう! –

11

は、ドキュメントを検討した後、私は正常にthis jsFiddleで、次の行に示されているように私の例にそれを適用:

var data = [{ 
    OrderID: '1', 
    FirstName: 'Bob', 
    LastName: 'Stevens' 
}, { 
    OrderID: '2', 
    FirstName: 'Jim', 
    LastName: 'Johnson' 

}]; 

function order(data) { 
    var self = this; 
    var model = ko.mapping.fromJS(data, {}, self); 
    model.FullName = ko.computed(function() { 
     return self.FirstName() + ' ' + self.LastName(); 
    }); 
    return model; 
} 

var mapping = { 
    create: function (options) { 
     return new order(options.data); 
    } 
}; 

function viewModel() { 
    var self = this; 
    self.orders = ko.mapping.fromJS(data, mapping); 
} 

var vm = new viewModel(); 

ko.applyBindings(vm); 
+1

爆弾解答!! –

関連する問題