I'm looking for a way to modify the Turkish characters and spaces in the names of JSON data objects. I plan to do this using WebApi

I am facing an issue with fetching data through an API. The JSON data format contains Turkish characters and spaces, causing problems when trying to display the data in a datatable. I have attempted to use the replace and parse functions, but so far, I have been unsuccessful.

Original JSON format:

 {
        "Kod Adı": "USD",
        "Alış Kür": "12.4448"
    },
    {
        "Kod Adı": "AUD",
        "Alış Kür": "8.8412"
    },
    {
        "Kod Adı": "DKK",
        "Alış Kür": "1.8851"
    },
    {
        "Kod Adı": "EUR",
        "Alış Kür": "14.0385"
    },
    {
        "Kod Adı": "GBP",
        "Alış Kür": "16.5046"
    },

Desired JSON format:

 {
        "KodAdi": "USD",
        "AlisKur": "12.4448"
    },
    {
        "KodAdi": "AUD",
        "AlisKur": "8.8412"
    },
    {
        "KodAdi": "DKK",
        "AlisKur": "1.8851"
    },
    {
        "KodAdi": "EUR",
        "AlisKur": "14.0385"
    },
    {
        "KodAdi": "GBP",
        "AlisKur": "16.5046"
    },

In addition to this, I am encountering a CORS policy error.

The request from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

I have tried various methods suggested in this article, but none have yielded positive results.

shared.service.ts

getAnalizor() : Observable<any[]>{
  return this.http.get<any>('http://15.12.1.05/analizorJSON.php')
}
arraysjsonangulartypescriptreplace

Answer №1

To utilize the function below, simply provide it with a list of field names -

function convertSpecialCharacters(text) {
  return text
    .replace(/\ğ/g, "g")
    .replace(/\ü/g, "u")
    .replace(/\ş/g, "s")
    .replace(/\ı/g, "i")
    .replace(/\ö/g, "o")
    .replace(/\ç/g, "c");
}

Answer №2

If you want to remove accented characters, you can utilize the String.prototype.normalize() method.

const str = "Alış Kür"
str.normalize("NFD").replace(/[\u0300-\u036f]/g, "")
> "Alıs Kur"

For more information on Unicode Normalization Forms like NFD and NFC, refer to Unicode Normalization Forms.

The normalize() function using NFD breaks down accented characters into separate simple components. For instance, ü is transformed into u + ̈.

We then use a regex replace operation to eliminate characters in the U+0300 → U+036F range, which encompasses all Diacritical Marks.

In order to account for the character "ı", you may need to perform an additional regex replacement like replace(/\ı/g, "i")

Therefore, the final code would look like:

const str = "Alış Kür"
str.normalize("NFD").replace(/[\u0300-\u036f]/g, "").replace(/\ı/g, "i").replace(" ", "")
> "AlisKur"

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Troubleshooting an Error with Ajax and PHP JSON Response

Having trouble with my website registration form. Getting 'null' as a response from the server when using json for data exchange. Here is the code: JavaScript code: $("#customer-form").submit(function() { var form_data = { c ...

phpjsonajax

Monitoring Object Changes in Angular 4

ETA: I am aware of different methods for monitoring my form for alterations. However, that is not the focus of my inquiry. As indicated by the title, my question pertains to observing changes within an object. The application displayed below is solely for ...

javascriptangulartypescript

How to efficiently deserialize JSON into a List of objects using Kotlin and Jackson without encountering a Deserialization Exception

I have been using the following link to learn how to read values using a mapper from a JSON string, but I encountered a deserialization exception while executing my code. How to use jackson to deserialize to Kotlin collections Code: private fun parseCou ...

arraysjsonkotlinjacksonjackson-databind

MongoDB issue: ConfigurationError - The port number should be in integer format

Hello, I am new to MongoDB and currently working on creating a free database using MongoLab. The name of my database is "enron" and I have created a collection named "mbox". I have a JSON file in my system that I am trying to import into the collection u ...

pythonjsonmongodb

Using the Go GraphQL client on the 'hello world' GraphQL server resulted in the error message: "unable to find a struct field for 'hello' to unmarshal in any of the 1 locations"

I've been experimenting with the https://github.com/shurcooL/graphql GraphQL client on a basic GraphQL server. I followed the code snippet provided at https://github.com/apollographql/apollo-server#installation-standalone: const { ApolloServer, gql } ...

jsongographql

Why does my test in Angular 2 e2e protactor fail when I do not include browser.sleep()?

While working on my e2e tests, I encountered an issue with a custom select dropdown component I created. When trying to select items in the dropdown, I found that I had to use browser.sleep(...) in my test for it to pass. If I don't include this sleep ...

angularprotractor

Encountering issues with upgrading Vue.js 2.5.2 with TypeScript

I am currently in the process of updating vue js to version 2.5.2 along with typescript 2.5.3. Below is my index.ts file: import Vue from 'vue' var app = new Vue({ el: '#app', data: { message: 'Hello Vue!' ...

typescriptvue.jsvuejs2

Error message encountered: "Ionic 3 on IOS encountered a failure while attempting to load a webpage, indicating a problem with the server's hostname being unavailable."

Has anyone else encountered the error message from Xcode when attempting to run an Ionic 3 project on the iOS 11 simulator? Even with a new project using a blank starter template, I continue to receive the same error. https://i.sstatic.net/BXcAQ.png UPDA ...

iosxcodeangularionic3

What are the steps to properly format a Typescript document in Visual Studio Code?

After experimenting with several plugins, I have not been able to achieve the same formatting as Sublime Text. Here is an example of the result after formatting. Ideally, I would like to maintain the properties in the same line if possible. Thank you. VSc ...

typescriptformattingvisual-studio-codecode-formatting

What is the process through which IPCRenderer.send() converts data into JSON serialization?

When attempting to transmit details about an error event using ipcRenderer.send("error", errorObject), I noticed that my Error object ends up being serialized as '{}' in the listener. It is common knowledge that ipcRenderer internally serializes ...

jsonserializationelectronipcrenderer

An error was encountered when trying to submit a Spark job through NiFi due to invalid

My attempt to submit a spark job includes setting a date argument in the conf property and running it through a script in NiFi. Unfortunately, I encountered an error while executing the script. Spark Submit Code within the script: aws emr add-steps --clu ...

jsonapache-sparkhadoopapache-nifi

Insert data into Typeorm even if it already exists

Currently, I am employing a node.js backend in conjunction with nest.js and typeorm for my database operations. My goal is to retrieve a JSON containing a list of objects that I intend to store in a mySQL database. This database undergoes daily updates, bu ...

mysqlnode.jstypescriptnestjstypeorm

What is the best way to utilize the `Headers` iterator within a web browser?

Currently, I am attempting to utilize the Headers iterator as per the guidelines outlined in the Iterator documentation. let done = false while ( ! done ) { let result = headers.entries() if ( result.value ) { console.log(`yaay`) } ...

javascripttypescriptdomecmascript-6iterator

Is it possible to deduce Typescript argument types for a specific implementation that has multiple overloaded signatures?

My call method has two signatures and a single implementation: call<T extends CallChannel, TArgs extends CallParameters[T]>(channel: T, ...args: TArgs): ReturnType<CallListener<T>>; call<T extends SharedChannel, TArgs extends SharedPar ...

typescriptoverloading

Setting up an Angular development environment without relying on the CLI framework

I've been diving into learning Angular and experimenting with demo apps, but I'm finding it difficult to get a clear understanding of how everything works and the underlying concepts. Most resources I come across emphasize using CLI for automatio ...

angular

Increase the size of the angular material accordion

I am dealing with a situation where I have 2 different accordion components on the same page. Each accordion contains multiple expansion panels. My challenge is to close all expanded panels from both accordions and only open the currently selected expans ...

angularangular-material

Ways to access a nested property within an array

I'm having an issue when trying to access a sub property of an array. Here's the snippet in question: ngOnInit() { this.menus = this.navService.defaultMenu; console.log(this.getMenusItem()); this.registerChangeInProjects(); } T ...

angulartypescript

Utilizing the onBlur event to control focus within a React element

In the React component I'm working on, I have implemented an onBlur event handler. The logic inside this handler is supposed to return focus back to the target element. This code is written in TypeScript. emailBlur(e: React.FocusEvent<HTMLInputEle ...

reactjstypescriptevent-handlingonbluronfocus

Module not found

Hey everyone, I recently updated my project to node version v14.18.0, but now I'm encountering a "module not found" issue (see screenshot below). Any suggestions on how to resolve this? https://i.stack.imgur.com/k0u82.png ...

node.jsangulartypescriptangular-materialnode-modules

Understanding the contrast between a put request subscription with an arrow versus without in Typescript

I'm sorry if the title is not very clear. In my Angular project, I have come across two different put requests: public Save() { const types: string[] = this.getTypes.getCurrentTypes(); this.userTypeService .updateTypes(this.userID, gro ...

javascriptangulartypescript