Unable to use ISO 4217 currency codes in currency property except for USD and EUR

[Tuariq]

Hi Team,

I have a scenario where a service returns with ISO 4217 currency codes and I have to show currency symbol based on some condition. But in the control, currency symbols are only shown for "USD" and "EUR". For rest codes (eg. "INR", "BGN" etc) it just shows $.

Could you please look into the issue? I have attached a demo project

Thanks

Tuariq

Attachment: CurrencyBug_Zip_30479ff7.zip

[Sureshkumar P]

Hi Tuariq, 

 

Greetings from Syncfusion support.  

 

Based on your shared information with provided sample, we suspect that you want to load the currency symbol in ‘BGN’ and ‘INR’.  We suggest you load the culture files to reflect the currency symbol.  

 

Kindly refer the code example.  

 

[app.component.html] 

 

<ejs-numerictextbox format='c2' currency="BGN" locale='bg' value='10'></ejs-numerictextbox> 

 

[app.component.ts] 

 

import { Component } from '@angular/core'; 

import { Ajax, loadCldr } from '@syncfusion/ej2-base'; 

 

@Component({ 

  selector: 'app-root', 

  templateUrl: './app.component.html', 

  styleUrls: ['./app.component.css'] 

}) 

export class AppComponent { 

  title = 'TimeBug'; 

 

  ngOnInit(): void { 

    this.loadCultureFiles('bg'); 

  } 

  loadCultureFiles(name: string, base?: boolean) { 

      var files = [ 'numbers.json', 'timeZoneNames.json', 'currencies.json']; 

      if (name === 'en-US') { 

          return; 

      } 

      let loadCulture = function (prop: any) { 

          let val: string, ajax: Ajax; 

          if (prop === files.length - 1) { 

              ajax = new Ajax('http://localhost:4200/assets/cldr-data/main/' + name + '/' + files[prop], 'GET', false); 

          } else { 

              ajax = new Ajax('http://localhost:4200/assets/cldr-data/main/' + name + '/' + files[prop], 'GET', false); 

          } 

          ajax.onSuccess = function (value: any) { 

              val = value; 

              loadCldr(JSON.parse(val)); 

          }; 

          ajax.send(); 

 

      }; 

      for (let prop = 0; prop < files.length; prop++) { 

          loadCulture(prop); 

      } 

  } 

} 

 

 

 

 

Please find the modifies sample here: https://www.syncfusion.com/downloads/support/directtrac/general/ze/CuurencyBasedOnCulture-539412708  

 

To know more about globalization. Please refer the documentation link : https://ej2.syncfusion.com/angular/documentation/numerictextbox/globalization/?no-cache=1  

 

Could you please check the above sample and let us know whether this is fulfilling your requirement or get back to us if you need further assistance. 

 

Regards, 

Sureshkumar P 

[Tuariq]

Hi Sureshkumar P,

Thanks for the reply.

The issue still exists in the demo solution also you have provided. In that also currency symbol shown is $, where as in actually it should be лв.

As told originally only these 2 symbols get loaded (either $ or €).

It would be a great help if you can provide a solution where other symbols are been shown.

Thanks

Tuariq

[Sureshkumar P]

Hi Tuariq, 

 

 

Thanks for your update.  

 

As per our previous update. The currency symbol worked based on loaded culture in your sample. Please check the sample video demonstration with screen shot here. 

 

Screenshot: 

 

 

 

Video demonstration of our previous updated sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/CurencyCodeNumeric-1193751223  

 

Regards, 

Sureshkumar P 

[Tuariq]

Hi SureshKumar P,

Thanks for the response.

Its strange but when I am using the provided project and running it, I am getting an exception and following error:

ERROR Error: Uncaught (in promise): NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'https://localhost:4200/assets/cldr-data/main/bg/numbers.json'.

Error: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'https://localhost:4200/assets/cldr-data/main/bg/numbers.json'.

I even referred to one another syncfusion documentation and  tried loading files using similar way but from node modules.

Document Refrence: https://ej2.syncfusion.com/documentation/common/how-to/localization-using-ajax/

For this also I am getting a similar type of error for the ajax call failure. Attaching this project also for reference.

Is there any step that I am missing?

Because I am able to load the files globally. Its just that I need to load it condictionally. In my scenario there can be multiple numeric controls with different currency symbols.

Any help would be really appreciated.

Thanks

Tuariq

Attachment: cldr_zip_5edc7000.zip

[Sureshkumar P]

Hi Tuariq, 

 

Thanks for your update.  

 

Query: Its strange but when I am using the provided project and running it, I am getting an exception and following error: 

 

ERROR Error: Uncaught (in promise): NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'https://localhost:4200/assets/cldr-data/main/bg/numbers.json'. 

Error: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'https://localhost:4200/assets/cldr-data/main/bg/numbers.json'.  

 

Answer:  

            Please copy and paste the “ej2-locale file from the node_modules/@syncfusion/ej2-locale” and “cldr-data file from the node_modules/cldr-data” folder into the “src/assets” folder before running the application to resolve the issue.  

 

Regards, 

Sureshkumar P 

[Tuariq]

Hi Team,

I tried the solution shared i.e copying ej2-locale file into assets while cldr-data was already present in it.

I could not attach modified solution as it goes beyond 30MB even after compressing.

Could I get a working demo project where currency symbols (Other than USD and EUR) are getting loaded conditionally as per our discussions?

It would be a great help to me!

Thanks

Tuariq

[Sureshkumar P]

Hi Tuariq, 

 

Thanks for your update. 

 

As per our previous update May 8^th, 2020. We have updated the working sample based on your requirement. please make use of that sample from your end to get workable in the currency symbol based on culture with currency format.  

 

After that update we suspect that you have not loaded the currency format with localization. Please follow the steps provided in that update to resolve the issue from your end.  

 

Sample link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/CuurencyBasedOnCulture-539412708  

 

Runnable steps. 

1.     Download the sample 

2.     Unzip the folder  

3.     Install the npm packages using npm install command 

4.     Run the sample using ng serve command  

 

Regards, 

Sureshkumar P 

[Tuariq]

Hi Team,

Thanks for the response.

I am able to load currency symbol using the provided solution in which cldr-data folder is copied in assets. 

But the issue is the size of cldr-data is approximate 250mb. (If I copy and keep this in assets as told in solution, this will give issues in creating builds)

Is there any way to meet this situation where such data need not to be copied and kept in assets?

Thanks

Tuariq

[Sureshkumar P]

Hi Tuariq, 

 

Thanks for your update.  

 

Based on your update, we suspect that you have copy and pasted total cldr-data folder with 365 cultures files. That is the reason the folder has around 250MB. We suggest you to only maintain your needed culture folders inside the cldr-data/main/ folder. 

 

Regards, 

Sureshkumar P 

[Tuariq]

Hi Team,

Thanks for the response. I get that solution.

However if I want all culture files, will it work if I save complete cldr-data on a server instead of saving locally and then get it by api call as per required?

Where currently we are loading from assets folder by making ajax call?

Will it work or it won't be supported?

Thanks

Tuariq

[Sureshkumar P]

Hi Tuariq, 

 

Thanks for your update.  

 

Yes it will work, you can host it in  the server instead of saving locally and then get it as per your requirement  

 

Regards, 

Sureshkumar P