आरएक्सजेएस ऑब्जेक्ट अपडेट्स और परिवर्तनों को देखकर

Question

मैं वर्तमान में किसी दिए गए ऑब्जेक्ट में किसी भी ऑब्जेक्ट को शामिल करने का प्रयास कर रहा हूं जिसमें इसके सभी तत्व शामिल हैं।

निम्न कोड केवल आग जब एक वस्तु [x] अद्यतन है, लेकिन नहीं करता है, तो व्यक्तिगत रूप से अद्यतन करने वस्तु [x] इस तरह के वस्तु के रूप में के तत्वों [x] [y]

<script> 
    var elem = document.getElementById("test1"); 

var log = function(x) { 
    elem.innerHTML += x + "<br/><br/><br/>"; 
}; 

var a = [{a:1,b:2}, 
     {a:2,b:5} 
     ]; 


var source = Rx.Observable 
.ofObjectChanges(a) 
.map(function(x) { 
    return JSON.stringify(x); 
}); 


var subscription = source.subscribe(
    function (x) {log(x);}, 
    function (err) {log(err);}, 
    function() {log('Completed');} 
); 

a[0] = a[1]; 
</script> 

इस कोड को रन और सही ढंग से आग लगती है।

हालांकि। अगर मैं इसके बजाय

a[0]['a'] = 3; 

तब कुछ भी नहीं होता है।

संपादित

एक बेहतर तरीका इस वाक्यांश को, मैं वस्तुओं की एक सरणी से परिवर्तन कैसे देख सकते हैं?

Answer 1

आप केवल नेस्टेड वस्तु परिवर्तन चाहते हैं

var source = rx.Observable.merge(
    rx.Observable.ofArrayChanges(a), 
    rx.Observable.from(a).flatMap(function(item) { 
    return rx.Observable.ofObjectChanges(item); 
    }) 
); 

(एक ही समारोह वे कर रहे हैं) flatMap या selectMany करने के लिए आप की अनुमति देगा एक मूल्य पर पुनरावृत्त करें और एक फ़ंक्शन निष्पादित करें जो एक अवलोकन योग्य देता है। इन सभी पर्यवेक्षकों के मूल्य वापस लौटाए गए एक नई धारा पर "चपटे" हैं।

http://reactivex.io/documentation/operators/flatmap.html

Answer 2

शायद (सरणी के लिए एक और अन्य सरणी के तत्वों को देख) दो observables मर्ज करके कुछ इस तरह:

var a = [ 
    {a:1,b:2}, 
    {a:2,b:5} 
]; 


var source1 = Rx.Observable.ofArrayChanges(a).map(function(x) { 
    return JSON.stringify(x); 
}); 

var source2 = Rx.Observable 
.fromArray(a.map(function(o, i) { return [o, i]; })) 
.flatMap(function(oi) { 
    return Rx.Observable.ofObjectChanges(oi[0]) 
    .map(function(x) { 
    var y = { 
     type: x.type, 
     object: x.object, 
     name: x.name, 
     oldValue: x.oldValue, 
     arrayIndex: oi[1] // pass the index of the member that changed 
    }; 
    return JSON.stringify(y); 
    }); 
}) 

source = source1.merge(source2) 

var subscription = source.subscribe(
    function (x) {log(x);}, 
    function (err) {log(err);}, 
    function() {log('Completed');} 
); 


a[0] = a[1] 
a[1]['b'] = 7 

धन्यवाद यहाँ @electrichead लिए हम उपयोग नहीं कर रहे concatMap क्योंकि स्रोतों हमने ofObjectChanges और ofArrayChanges द्वारा कभी पूरा नहीं किया।

var source = rx.Observable.from(a).flatMap(function(item) { 
    return rx.Observable.ofObjectChanges(item); 
}); 

आप भी a[0] = a[1] तरह परिवर्तन चाहते हैं:

Answer 3

यहाँ Rx.Observable.ofNestedObjectChanges की एक काम उदाहरण सरल कार्यान्वयन है, तो आप इसे का सार मिलता है और आप ही लागू कर सकते हैं।

http://jsbin.com/wekote/edit?js,console

 Rx.Observable.ofNestedObjectChanges = function(obj) { 
      if (obj == null) { throw new TypeError('object must not be null or undefined.'); } 
      if (typeof Object.observe !== 'function' && typeof Object.unobserve !== 'function') { throw new TypeError('Object.observe is not supported on your platform') } 
      return new Rx.AnonymousObservable(function(observer) { 
       function observerFn(changes) { 
        for(var i = 0, len = changes.length; i < len; i++) { 
         observer.onNext(changes[i]); 
        } 
       } 
       Object.observe(obj, observerFn); 
       //Recursive observers hooks - same observerFn 
       traverseObjectTree(obj, observerFn); 

       function traverseObjectTree(element, observerFn){ 
        for(var i=0;i<Object.keys(element).length;i++){ 
         var myObj = element[Object.keys(element)[i]]; 
         if(typeof myObj === "object"){ 
          Object.observe(myObj, observerFn); 
          traverseObjectTree(myObj,observerFn); 
         } 
        } 
       } 

       return function() { 
        Object.unobserve(obj, observerFn); 
       }; 
      }); 
     }; 



     //Test 
     var json = { 
      element : { 
       name : "Yocto", 
       job : { 
        title: "Designer" 
       } 
      }, 
      element1: { 
       name : "Mokto" 
      } 
     }; 

     setTimeout(function(){ 
      json.element.job.title = "A Great Designer"; 
     },3000); 


     var source = Rx.Observable.ofNestedObjectChanges(json); 

     var subscription = source.subscribe(
      function (x) { 
       console.log(x); 
      }, 
      function (err) { 
       console.log('Error: %s', err); 
      }, 
      function() { 
       console.log('Completed'); 
      }); 

     json.element.name = "Candy Joe";