How to get readable template content using Javascript - angular

[ramesh]

Hi,

We are designing a template using Rich Text Editor, designed document looks like below.

From the UI side, we need to get plain readable text which consists of label information of all Account related fields placed in the editor.

Expecting an output string like " Account.CurrentTotal }{ Account.FinanceCharge }{ Account.LastPaymentAmount }{ Account.Alert }"

Can you suggest which method or function must be used in order to get the required output? 

appreciate your help, any sample code will help us a lot.

Thanks and regards,

Ramesh

[Gunasekar Kuppusamy]

Hi Ramesh,

Greetings from Syncfusion support.

We have validated your reported query " Expecting an output string like "{ Account.CurrentTotal }{ Account.FinanceCharge }{ Account.LastPaymentAmount }{ Account.Alert }"Can you suggest which method or function must be used in order to get the required output? "

We can achieve this functionality using the RichTextEditor executeCommand public method.

We have created a sample for your reference.

Code snippets:

public BtnClick = (): void => {

    var stringArray = [

      '{Account.CurrentTotal }',

      '{ Account.FinanceCharge }',

      '{ Account.LastPaymentAmount }'

    ];

    var content = '';

    var arrayLength = stringArray.length;

    for (var i = 0; i < arrayLength; i++) {

      content = content + stringArray[i] + '<br>';

    }

    this.rteObj.executeCommand('insertHTML', content);

  };

Sample: https://stackblitz.com/edit/angular-hbgfdp?file=app.component.ts

Please check the sample and let us know if the solution helps,

Regards,

Gunasekar

[ramesh]

Dear  Gunasekar Kuppusamy,

Thanks for helping me to solve this problem, looks like you did it in a reverse output. Required template already designed with necessary information like below

I need to get an alert message with all information when I click on a button like below

hoping you can update the code sample with minimal changes to suit the required solution.

Thanks and regards,

Ramesh

[Gunasekar Kuppusamy]

Hi Ramesh,

Good day to you.

We have validated your reported query "I need to get an alert message with all information when I click on a button .hoping you can update the code sample with minimal changes to suit the required solution."

Yes, We can achieve your requirement using RichTextEditor value property and we have created a sample for your reference.

Code snippets:

 alert((this.rteObj.value as any).replace(/<[^>]*>/g, ''));

Sample: https://stackblitz.com/edit/angular-hbgfdp-qa6rpx?file=app.component.ts

Please check the sample and let us know if the sample helps,

Regards,

Gunasekar