RxJS асинхронной обработка потоков

Question

//app.js 
import $ from 'jquery'; 
import Rx from 'rxjs/Rx'; 

var $pull = $('#fetch');//this is a button id 
var pull$ =Rx.Observable.fromEvent($pull,'click').startWith("/hcdata.json"); 

var $result = $(".datab");//class for HTML table 
var classarray = ['id','type','name','image','tn']; 

var resp$ = pull$.flatMap(
    function(reqdata){ 
     return Rx.Observable.fromPromise($.getJSON(reqdata)); 
    }); 

var pri$ = resp$.subscribe(
    function(data){ 
     var head = Object.keys(data[0]); 
     var len = head.length; 
     $result.empty(); 
     $("<tr>").appendTo($result); 
     $.each(head,function(i,value){ 
     $("<th class='tablehead'>"+value.toUpperCase()+"`</th>").appendTo($result)})` 
     $("</tr>").appendTo($result); 
     console.log(head); 

     for(var j= 0;j<data.length;j++) 
     { 
      $("<tr >").appendTo($result); 
      for(var i =0;i<len;i++) 
      { 
       //alert(data[j][head[i]]); 
       $("<td contenteditable='true' class='"+classarray[i]+"''>"+data[j][head[i]]+"</td>").appendTo($result) 
      } 
      $("</tr>").appendTo($result); 
     } 

    }, 
    function(err){ 
     console.log(err); 
    }, 
    function(){ 
     console.log("Completed"); 
    }); 

    //element assignment 
    var $idv = $(".id"); 
    var $typv = $(".type"); 
    var $nmv = $(".name"); 
    var $imgv = $(".image"); 
    var $tnv = $(".tn"); 

    //not working with no errors 
    var abc$ = Rx.Observable.defer(function(){ 
     return Rx.Observable.fromEvent($idv,'blur'); 
    }); 

    var lat$ = abc$.map(function(e){ 
     console.log(e.target.innerText);  
     return e.target.innerText; 
    }).flatMap(function(data){ 
     return Rx.Observable.fromPromise(function(data){ 
      return Promise.resolve(data); 
     }); 
    }); 

    var sub = lat$.subscribe(function(x){ 
     if (x === parseInt(x, 10)) 
      alert("data is integer") 
     else 
      alert("data is not an integer") 
    }, 
    function(err){ 
     console.log(err); 
    }, 
    function(){ 
     console.log("Finally"); 
    }) 

У меня есть неправдоподобные данные из файла JSON упомянутого и структурирование его в таблицу, которая работает проблему fine.The, я хочу, чтобы попытаться использовать ONBLUR события на редактирование любой ячейки и в дальнейшем делать валидации внесенных изменений, обработка этого события не работает без ошибок. Я новичок в этом асинхронном стиле реактивного программирования. Пожалуйста помоги.

Answer 1

Его снова проблема BackTick. Исправьте это, и тогда вы сможете понять фактическую ошибку.

//app.js 
import $ from 'jquery'; 
import Rx from 'rxjs/Rx'; 

var $pull = $('#fetch');//this is a button id 
var pull$ =Rx.Observable.fromEvent($pull,'click').startWith("/hcdata.json"); 

var $result = $(".datab");//class for HTML table 
var classarray = ['id','type','name','image','tn']; 

var resp$ = pull$.flatMap(
    function(reqdata){ 
     return Rx.Observable.fromPromise($.getJSON(reqdata)); 
    }); 

var pri$ = resp$.subscribe(
    function(data){ 
     var head = Object.keys(data[0]); 
     var len = head.length; 
     $result.empty(); 
     $("<tr>").appendTo($result); 
     $.each(head,function(i,value){ 
     $("<th class='tablehead'>"+value.toUpperCase()+"`</th>").appendTo($result)}) 
     $("</tr>").appendTo($result); 
     console.log(head); 

     for(var j= 0;j<data.length;j++) 
     { 
      $("<tr >").appendTo($result); 
      for(var i =0;i<len;i++) 
      { 
       //alert(data[j][head[i]]); 
       $("<td contenteditable='true' class='"+classarray[i]+"''>"+data[j][head[i]]+"</td>").appendTo($result) 
      } 
      $("</tr>").appendTo($result); 
     } 

    }, 
    function(err){ 
     console.log(err); 
    }, 
    function(){ 
     console.log("Completed"); 
    }); 

    //element assignment 
    var $idv = $(".id"); 
    var $typv = $(".type"); 
    var $nmv = $(".name"); 
    var $imgv = $(".image"); 
    var $tnv = $(".tn"); 

    //not working with no errors 
    var abc$ = Rx.Observable.defer(function(){ 
     return Rx.Observable.fromEvent($idv,'blur'); 
    }); 

    var lat$ = abc$.map(function(e){ 
     console.log(e.target.innerText);  
     return e.target.innerText; 
    }).flatMap(function(data){ 
     return Rx.Observable.fromPromise(function(data){ 
      return Promise.resolve(data); 
     }); 
    }); 

    var sub = lat$.subscribe(function(x){ 
     if (x === parseInt(x, 10)) 
      alert("data is integer") 
     else 
      alert("data is not an integer") 
    }, 
    function(err){ 
     console.log(err); 
    }, 
    function(){ 
     console.log("Finally"); 
    })