私は 2 つの Bacon.jQuery を持っていますModels(ただし、問題は Bacon で説明できますObservable)。
foo、barおよびの3 つのコンボ ボックスがありquuxます。barに依存し、fooとquuxの組み合わせに依存しbarますquux。とからコンボボックスfindQuuxの値を見つける関数があります。quuxfoobar
ユーザーがfooコンボボックスを変更すると、barとquuxボックスの値が選択されます。これは選択の実用的な実装ですquux:
// WORKS
var quuxBus = new Bacon.Bus()
Bacon.onValues(fooModel, barModel, function (foo, bar)
{
quuxBus.push(findQuux(foo, bar))
})
quuxModel.addSource(quuxBus.toProperty('quux4'))
ページの読み込み時に正しく'quux4'設定するにはハックが必要なため、このソリューションには少し問題があります。quuxしかし、次のより単純な解決策はまったく機能しません。
// DOESN'T WORK
var quuxCombo = Bacon.combineWith(findQuux, fooModel, barModel)
quuxModel.addSource(quuxCombo)
問題は、 aが見つからない不可能な組み合わせが与えられると、andとfindQuuxの有効な組み合わせが期待されてクラッシュすることです。foobarquux
ユーザーがコンボボックスを変更したときに一度だけ呼び出されるため、onValues/pushソリューションは機能します。が 2 回呼び出されるため、ソリューションは機能しません。findQuuxfoobacon.combineWithfindQuux
のデータ ソースを実装するための推奨される方法は何quuxModelですか? 防御的なコーディングfindQuuxはオプションではありません。
完全なコードはhttp://jsfiddle.net/5zp4D/8/にあります。
更新:ページの読み込みに対して適切な値が既に存在fooします。barフィドル リンクからわかるようfooModelに、明示的な値で初期化され、barModelその初期値から再計算されます。
var fooModel = Bacon.$.selectValue(fooDom, 'foo2-value')
var barModel = Bacon.$.selectValue(barDom)
barModel.addSource(fooModel.map(function (x)
{
return json[x][1].val
}))
foobar決して無効な値を取らないでください。さらに、barユーザーが変更されると再入力さfooれるため、有効な組み合わせのみが UI に表示されます。
アプローチの問題combineWithは、ユーザーが切り替えるとfoo、findQuux関数が中間値で2回呼び出され、中間の組み合わせの1つが正しくなく、組み合わせの構成要素が個別に正しいことです。問題をよりよく説明するためにフィドルを変更しました：http://jsfiddle.net/5zp4D/12/
有効な組み合わせからわかるようにvar json、1-1、1-2、2-3、2-4、および 2-5 です。
壊れたバージョンのコメントを外し、ログを追加しました。foo1最初のコンボボックスを選択してから再度選択するとfoo2、ログに 3 つではなく 4 つのメッセージが表示されます。
ページの読み込み時に、quux値が正しく初期化されていることがわかります (2-4):
"valid combination of foo2-value and bar4-value"
foo1代わりに選択すると、foo2それfindQuuxDefが 1-4 ( foois new, baris old) で呼び出され、次に 2-4 ( foois new, baris new)で呼び出されます。
"invalid combination of foo1-value and bar4-value"
"valid combination of foo1-value and bar2-value"
私の問題は、無効な中間の組み合わせがアプローチで発生しないことonValues/pushです。リンクされた要素を使用した UI への慣用的な推奨アプローチを知りたいです。