Unable to access class member from wijmo helper methods

Unable to access class member from wijmo helper methods

Posted by: chayankar209 on 18 May 2018, 3:02 am EST

• 

  chayankar209

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 18 May 2018, 3:02 am EST

  I am unable to invoke/access class level functions&properties from the callback which was passed to “FlexSheet.addFunction”.

  When I try to update class level property value, the value gets updated, but the updated value is not getting rendered in UI. The code is absolutely fine.

  Please suggest !!

  Thank you !

• 

  chayankar209

  • Post Options:
  • Link
    Copy

  Posted 18 May 2018, 3:56 am EST

  To elaborate a bit…

  This is an Angular 2+ application.

  I have a webpage which has the following:

  1. A form with some fields e.g. DateFrom, DateTo, SiteId

  2. A class level function e.g. GetCapacityFromDB(dateFrom, DateTo, SiteId) which makes HTTP request to fetch data from backend using the value of the form fields as parameters and returns a integer. Capacity value for the Site for the date range

  3. An empty FlexSheet

  I am trying to add a CustomFunction in the flexsheet called GetCapacity() with no parameters.

  My objective is that the user will type in =GetCapacity in the FlexSheet cell.
  
  It will then call class level function and return the integer as explained in point #2 above.

  The problem I am facing is that:
  
  A. I am being able to access class level function GetCapacityFromDB while declaring, but at run time none of the class level members are getting available.
  
  B. Since the HTTP request is asynchronous, how do I wait for the value from DB to return, before I return the value for the CustomFunction call.

  Refer to the below code snippet:

  this.flxSheet = new FlexSheet("#excel");
  this.flxSheet.addUnboundSheet("Report Template",500,500,0);
  this.flxSheet.addFunction("GetCapacity",this.GetCapacityFromDB,"Returns Installed Capacity of the Site",0,0); 
  

  GetCapacityFromDB(dateFrom, DateTo, SiteId){
  
  const that = this;
  
  let param: QueryParam= new QueryParam();
  
  let result=0;
  
  param.FieldId = SiteId;
  
  param.StartDate = dateFrom;
  
  param.EndDate =DateTo;
  
  that.reportService.GetFieldData(param).subscribe(data=>{
  
  console.log(data);
  
  result= data.length;
  
  });
  
  return result
  
  }

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 21 May 2018, 3:22 am EST

  Hi,
  
  The custom Function should be defined in the same place where addFunction is getting called. It should not be at Class level.

  Please refer to the following sample for the same.
  
  https://stackblitz.com/edit/angular-yigrsg?file=app/app.component.ts

  ~Manish

• 

  chayankar209

  • Post Options:
  • Link
    Copy

  Posted 21 May 2018, 3:35 am EST

  Okay. But we are still facing issue with rendering Web API call result. Since the HTTP call is asynchronous in nature, so somehow the wijmo control is not able to set the result in target cell.

  How can we set value to a FlexSheet cell, by executing a custom fucntion which internally makes an external API call. The returned value should be set in the cell automatically.
  
  We are trying not to use SetCellValue helper method !

  Thank you !!

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 22 May 2018, 2:19 am EST

  Hi,
  
  We are sorry, we are unable to find a way.
  
  Please do not make any internal call from CustomFunction. Make a call and use result in function and invalidate the FlexSheet to update value for function.

  ~Manish

• 

  chayankar209

  • Post Options:
  • Link
    Copy

  Posted 22 May 2018, 7:37 am EST

  Hi,

  Okay. Thank you for your input. I need another input from you,

  When I am trying to access a class memeber from the custom fucntion, I am unable to do so. The member is “undefined”.

  what is the correct approach to access class level member from custom function ?

  Thank you !!

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 23 May 2018, 6:10 am EST

  Hi,
  
  Please refer to the previously shared sample for the same. Here is the code snippet for the same:

  flexSheetInit(flexSheet){   
      let _this=this;
      let customSumProductsFunc=()=>{
        var result = 0,
          range1 = arguments[0],
          range2 = arguments[1];
      [b]  // access Class level properties
        console.log("Number in Formula Definition",this.num);
        // access Class level method
         this.testMethod();[/b]
      if (range1.length > 0 && range1.length === range2.length && range1[0].length === range2[0].length) {
          for (var i = 0; i < range1.length; i++) {
              for (var j = 0; j < range1[0].length; j++) {
                  result += range1[i][j] * range2[i][j];
              }
          }
      }
  

  ~Manish