SpreadJS RIch Text implmentation in Angular 6

SpreadJS RIch Text implmentation in Angular 6

Posted by: vinayakbagi on 4 June 2020, 11:58 am EST

• 

  vinayakbagi

  • Post Options:
  • Link
    Copy

  Posted 4 June 2020, 11:58 am EST

  Hi Team,

  Can you please share demo code for Implement RIch Text feature in Angular 6.

  Thanks and Regards,
  
  Vinayak

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 5 June 2020, 8:55 am EST

  Hi Vinayak,

  Please refer to the following docs and demo which demonstrates how we would use rich text:
  
  Demo: https://www.grapecity.com/spreadjs/demos/features/cells/basic-rich-text/purejs
  
  Docs: https://www.grapecity.com/spreadjs/docs/v13/online/SettingRichTextCell.html?highlight=rich%2Ctext%2C

  Further, you may also refer to the following sample which demonstrates the rich text functionality in angular:
  
  https://stackblitz.com/edit/hello-angular-6-u6cbxt?file=src/app/app.component.ts

  Regards

• 

  vinayakbagi

  • Post Options:
  • Link
    Copy

  Posted 9 June 2020, 9:24 am EST

  Hi Sharad,

  I went through above code but didn’t find a proper way to implement superscript to selected text. Could you share code specific for this one in angular.

  Thanks and Regards,
  
  Vinayak

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 10 June 2020, 9:55 am EST

  Hi Vinayak,

  For making the text superscript you may use vertAlign property and set the vertical alignment to top please refer the following code snippet

  let richText = {richText:
  [
       {
           style: {
                    font: "normal 24px Calibri",
                    vertAlign: GC.Spread.Sheets.VerticalAlign.top
                  },
                  text: text
        },
  ]
  }
  spread.getActiveSheet().setValue(0,0,richText);
  

  Further, we are working on a sample in angular to demostrate the same and will share it with you soon.

  Regards

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 12 June 2020, 1:58 am EST

  Please refer to the following sample demonstrating superscript in angular:
  
  https://codesandbox.io/s/gallant-keller-zz43p?file=/src/app/app.component.ts

  Also, I noticed that my previous reply had an error, instead of VerticalAlign.top, it needs to be VertAlign.superscript:

  let richText = {richText:
  [
       {
           style: {
                    font: "normal 24px Calibri",
                    vertAlign: GC.Spread.Sheets.VertAlign.superscript
                  },
                  text: text
        },
  ]
  }