Transform the JSON object into a TypeScript array

Currently working on a project that requires converting a JSON object into a TypeScript array. The structure of the JSON is as follows:

{
  "uiMessages" : {
    "ui.downtime.search.title" : "Search Message",
    "ui.user.editroles.sodviolation.entries" : "Violated SOD entries"
  },
  "userInfo" : {
    "login" : "fooUser",
    "firstName" : "Foo",
    "lastName" : "Bar",
    "language" : "en"
  },
  "appInfo" : {
    "applicationName" : "foo",
    "applicationVersion" : "6.1.0"
  }
}

The JSON represents a serialized Java object where uiMessages variable is a HashMap in Java. The goal is to parse the uiMessages into a TypeScript Array consisting of uiMessage objects.

Here's what has been achieved so far:

@Injectable()
export class BootstrapService {

  constructor(private http: Http) {}

  getBootstrapInfo() {
    return this.http.get('api/foo')
      .map(response => {
        response.json()
      })
  }
}

Looking for suggestions on the best way to accomplish this task.

Answer №1

Give this a try:

@Injectable()
export class BootstrapService {

    constructor(private http: Http) {}

    getBootstrapData() {
        return this.http.get('api/foo')
            .map(response => {
                var responseData = response.json();
                var output = [];
                for (let key in responseData.uiMessages) {
                    // Construct the uiMessage object here, structure unknown
                    output.push({
                        field: key,
                        message: responseData.uiMessages[key]
                    });
                }
                return output;
            });
    }
}

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

Is there a way to efficiently manage multiple modules in AngularJS? I've put in a lot of effort, but while one module is functioning properly, the

angular .module('ApplicationOne',[]) .controller('myControllerOne', function($scope){ $scope.name = "Luther"; $scope.fname = "Martin"; $scope.ed = "B.TECH"; }); angular .module('App2&apos ...

Employing jQuery to populate information into an input field, yet encountering an issue where the data is not being successfully transmitted to

On my page, there is a form with an input box <input name="bid_price" id="bid_price" class="form-control"> If I manually enter a value, it gets posted successfully But when I try to insert a value using jQuery, it doesn't get posted, even tho ...

extract information from an external JSON document

I have a JSON file filled with data, along with a JSX file containing a button and a div. I'm looking to extract the data from the JSON file and display it in the div when the button is clicked. However, I'm at a loss on how to achieve this. The ...

Issue with Angular's ngOnChanges Lifecycle Hook Preventing Function ExecutionWhen attempting to run a function within Angular's ngOn

In the midst of my evaluation process to ensure that specific values are properly transmitted from one component to another using Angular's custom Output() and EventEmitter(), I am encountering some issues. These values are being sent from the view of ...

Ways to retrieve JSON objects from the Controller using ajax

Currently, I am developing a mail validation controller using jQuery AJAX and PHP. Once the message is validated in the PHP controller, I attempt to retrieve it using AJAX and display it on the screen using jQuery. Here is an excerpt of my AJAX code: .. ...

Tips for determining whether a value is present in an array or not

I'm trying to prevent duplicate values from being pushed into the selectedOwners array. In the code snippet below, the user selects an owner, and if that owner already exists in the selectedOwners array, I do not want to push it again. How can I imple ...

Place the token within the Nuxt auth-module

Working on a project using the Nuxt auth-module. The Login API response is structured like this: data:{ data:{ user:{ bio: null, createdAt: "2021-06-29T12:28:42.442Z", email: "<a href="/cdn- ...

The value of the cookie is not set (version 2.0.6 of react-cookie)

I am encountering an issue with implementing react cookies version 2. I am using webpack-dev-server for testing. Below is the console log: Warning: Failed context type: The context cookies is marked as required in withCookies(App), but its value is unde ...

What is the best way to use jQuery to emphasize specific choices within an HTML select element?

Seeking help with jQuery and RegEx in JavaScript for selecting specific options in an HTML select list. var ddl = $($get('<%= someddl.ClientID %>')); Is there a way to utilize the .each() function for this task? For Instance: <select i ...

What is the process for constructing a regular expression (regex) in JavaScript to validate an id?

My validation requirements are relatively straightforward, but as someone who is new to regex, I am in need of quick assistance. The format should be either 1234567890 or 123456-7890, allowing for any number ranging from 0 to 9 and a total character length ...

Using jQuery Mobile alongside two distinct versions of jQuery

My current task involves inserting both jQuery and custom JavaScript into the DOM of an existing page. The jQuery is inserted right before my script, where I utilize window['my$'] = jQuery.noConflict(true);. This approach worked smoothly after ...

Encountering type-checking errors in the root query due to the specific types assigned to my root nodes in a GraphQL and TypeScript application built using Express

As I delve into the world of typescript/graphql, I encountered a peculiar issue while trying to define the type for one of my root nodes. The root node in question simply fetches a user by ID in the resolve function, and thus, I assigned the 'type&apo ...

Incorporating Hive SerDe jar into SparkSQL Thrift Server

My Hive tables are linked to JSON files as their contents, requiring the use of a JSON SerDe jar (available here) in order to query them. On the machine hosting my Hadoop distribution, I can easily add the jar to Hive or Beeline CLI by executing: ADD JAR ...

A guide on accessing JSON files from a Cosmos DB container using Python scripts

I need to retrieve a JSON file from the container, make changes to it, and save it back in JSON format. I have read-only access to Cosmos DB. Here is an image of Cosmos DB: https://i.stack.imgur.com/SWSdz.jpg I encountered the following error: CosmosRes ...

Troubleshooting the issue of the Delete Service not functioning properly within Angular

ListStore.ts file export class ListstoreComponent implements OnInit { rawlist; name = ''; id = ''; storeid = ""; store: Store; constructor(private api: APIService, private router: Router, private route: ActivatedRoute, pri ...

Troubleshooting: JavaScript code not functioning properly with variable input instead of fixed value

I have encountered an issue with a JS function that I'm using. The function is shown below: // A simple array where we keep track of things that are filed. filed = []; function fileIt(thing) { // Dynamically call the file method of whatever ' ...

How can I simulate pressing the ENTER key in Selenium without selecting any element?

Having trouble using the firefox selenium plugin and sending the enter key after pasting text? The ENTER key press should not interact with any other element on the page, just a simple 'dumb' ENTER key press. error [error] Element name=code not ...

Is there a way to adjust this callback function in order to make it return a promise instead?

This script is designed to continuously attempt loading an image until it is successful: function loadImage (url = '', callback = () => {}) { utils.loadImage(url, () => { callback() }, () => { loadImage(url, callback) }) } ...

How to stop AngularJS onClick event from causing scroll to jump to top of

As I work on developing a website using Angular JS and Bootstrap, I encountered an issue with the hamburger menu button on my homepage. Whenever I scroll halfway down the page and click the hamburger icon, it automatically scrolls me back to the top of the ...

Enhancing the appearance of a JSX component in React

I have a segment of code within my project that calculates a specific percentage and displays it on the dashboard. <text className="netProfit-circle-text" x="50%" y="50%" dy=".2em" textAnchor="middl ...