:ノックアウトJsの二つの配列を結合し、フィルタリング - 私は次のように定義された2つのモデル持っているベストプラクティス
var Card = function (id, name, detail, rowId) {
this.id = ko.observable(id)
this.name = ko.observable(name)
this.detail = ko.observable(detail)
this.rowId = ko.observable(rowId)
}
var Row = function (id, title, detail, cards) {
this.id = ko.observable(id)
this.title = ko.observable(title)
this.detail = ko.observable(detail)
this.cards = ko.observableArray([])
}
はここで行とカードの配列です:
var cards = [
{
"id" : "-Ke__R4fK_OVSRAxZrjp",
"detail": "More information about Card One",
"name": "Card One",
"rowid": "-KeFnIJLJtMz3RojUNx2",
"url": "https://firebasestorage.googleapis.com/v0/b/leanlanes-becb2.appspot.com/o/card-images%2F142667555.jpg?alt=media&token=8d64656a-29d3-44b1-b62c-1232388a59c3"
},
{
"id" : "-KedLYCo2L1dyNXqsrY2",
"detail": "Nice little article",
"name": "A piece of work",
"rowid": "-KeFnIJLJtMz3RojUNx2",
"url": "https://firebasestorage.googleapis.com/v0/b/leanlanes-becb2.appspot.com/o/card-images%2FA%20piece%20of%20yourself.jpg?alt=media&token=72aebfba-fdc1-4966-9272-e0103ba786a0"
},
{
"id" : "-Keinb9kpnjyBAYNj1Co",
"detail": "345ggg",
"name": "New card 23",
"rowid": "-KeFnIJLJtMz3RojUNx2",
"url": ""
}
]
var rows = [
{
"id" : "-KeFnIJLJtMz3RojUNx2",
"detail" : "Some small info about this row",
"title" : "This is the first row"
},
{
"id" : "-KeFoCUybj0DcvYTiH1T",
"detail" : "Some information about a subsequent row of info",
"title" : "The second row"
},
{
"id" : "-KeK04XQCnGweRifYDsd",
"detail" : "Details about a row",
"title" : "The row title"
},
{
"id" : "-Ke_4jxrsdUw0-S0sv02",
"detail" : "Will this row work? ",
"title" : "Fourth Row"
}
]
ここに私のViewModelです:
var ViewModel = function (cards, rows) {
// Row view bindings
this.currentRowId = ko.observable()
this.rows = ko.observableArray(rows.map(function (row) {
return new Row(row.id, row.title, row.detail)
}))
// Card view bindings
this.currentCardName = ko.observable()
this.currentCardDetails = ko.observable()
this.cards = ko.observableArray(cards.map(function (card) {
return new Card(card.id, card.name, card.detail, card.rowid)
}))
this.setCards = function(rowid, cardsarray) {
return ko.utils.arrayFilter(cardsarray, function (card) {
return (card.rowid === rowid) // return card if matches rowId
})
}
}
カードを行に正しく追加するための最良の方法を理解していません。私は多くの異なるルートを試しました:フィルタリング、行オブジェクトの新しいカードを呼び出す...しかし、私は最高の戦略を確信していません。
カードを行に追加するとどういう意味ですか?より多くの説明を提供できますか? – muhihsan
カードモデルには、親の行IDを含む "card.rowId"というプロパティがあります。これは、カードがそれがどの行に属しているかを認識していることを意味します。問題は、私はカードの配列、親の行への参照を持つ各カード、行の配列がありますが、ViewModelでそれを正しく設定する方法がわからないので、各行には、カードによって。 –