Bind two observables in knockout.js [closed] - binding

Question

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 10 years ago.
I have two simple observables, for example,
val1 = ko.observable("input1");
val2 = ko.observable("input2");
and I want them to act like one, so when one of them changes, the other changes as well.
I know that in common case it's better to use only one observable and bind it to several dom elements. But in my case theese observables live in different templates and objects, so they can't be one variable.
Currently I subscribe one observable to another and vice versa:
val1.subscribe(function(v) {
val2(v);
});
val2.subscribe(function(v) {
val1(v);
});
However when you change the value of one observable, it updates the second, but that causes a ripple effect and updates the first one again, ad infinitum.
How can I set up a two-way binding between two separate observables which sets the value of one when you modify the other without causing an infinite loop?

Answer 1

You can do something like this:
vm1 = {
val1: ko.observable('input1'),
otherProperty: ko.observable('more')
}
vm2 = {
val2: vm.val1,
otherProperty: ko.observable('data')
}
Both vm1.val1 and vm2.val2 resolve to the same observable and therefore the same value.

Answer 2

Sethi's answer will work, but this might be better served with computed observables
Example: http://jsbin.com/exipuq/1/edit
var viewModelA = function(){
this.myVal = ko.observable();
};
var viewModelB = function(otherViewModel){
this.compVal = ko.computed(function(){
return otherViewModel.myVal();
});
};
// create a new viewmodel like normal
var vma = new viewModelA();
// pass the instantiated view model
// into the new one you're creating
var vmb = new viewModelB(vma);