best method for implementing a TypeScript object

Question

best method for implementing a TypeScript object

I've been searching high and low, but I can't seem to find the exact answer I need. Please inform me if my question has already been asked.

My goal is to construct an object in TypeScript that includes attributes of custom types.

The issue I'm facing is that my server supplies object data with URLs. I'm unsure how to handle this mapping situation. I hope I'm explaining it clearly enough – I'm still learning! By the way, I am working with Angular and TypeScript

Let me give you an example. This is what the object looks like:

export class Contact { 
    name : string;
    address : {
        street : string;
        city : string;
    }
}

However, the JSON retrieved from the server appears as follows:

{
    "name" : "firstname lastname",
    "address" : "http://localhost:5000/contacts/001"
}

If I use the address URL, I should receive the address in JSON format.

Thank you for your time!

angular typescript

Answer 1

Answer №1

Extract the JSON data fetched from the server and assign it to your variables as shown below:

...
.subscribe(
data => {
  this.firstName = data.first_name
  this.lastName = data.last_name
})

Please keep in mind that it is recommended to create a dedicated service for handling server requests.

Answer 2

Extract the JSON data fetched from the server and assign it to your variables as shown below:

...
.subscribe(
data => {
  this.firstName = data.first_name
  this.lastName = data.last_name
})

Please keep in mind that it is recommended to create a dedicated service for handling server requests.

Answer 3

Answer №2

If you're wondering how to convert data retrieved from a server into TypeScript objects, one approach is to create a static method within the class that can instantiate a new instance of the class. This method would take an object of type "any" as input and return an object with all properties mapped accordingly. You can then utilize this method after an HTTP request or subscription, depending on your specific setup.

export class Address {
   constructor(public name:string, description: string){
    }
   public static NewInstance(address: any){
      //perform mapping here
      return new Address(address.db_name, address.address);
   }
}
export class Student {
    constructor(
        public name : string,
        public classes: StudentClass[],
        public address: Address
    ){

    }
     public static NewInstance(student: any){
         let studentclasses = student.classes.map(n => StudentClass.NewInstance(n));
         return new Student(student.firstname+' ' + student.lastname, studentclasses, Address.NewInstance(student.addresss));
    }

}
export class StudentClass {
   constructor(public: name: string);
   public static NewInstance(studentclass: any){
        return new StudentClass(studentclass.namefromdb);
   }
}

Answer 4

If you're wondering how to convert data retrieved from a server into TypeScript objects, one approach is to create a static method within the class that can instantiate a new instance of the class. This method would take an object of type "any" as input and return an object with all properties mapped accordingly. You can then utilize this method after an HTTP request or subscription, depending on your specific setup.

export class Address {
   constructor(public name:string, description: string){
    }
   public static NewInstance(address: any){
      //perform mapping here
      return new Address(address.db_name, address.address);
   }
}
export class Student {
    constructor(
        public name : string,
        public classes: StudentClass[],
        public address: Address
    ){

    }
     public static NewInstance(student: any){
         let studentclasses = student.classes.map(n => StudentClass.NewInstance(n));
         return new Student(student.firstname+' ' + student.lastname, studentclasses, Address.NewInstance(student.addresss));
    }

}
export class StudentClass {
   constructor(public: name: string);
   public static NewInstance(studentclass: any){
        return new StudentClass(studentclass.namefromdb);
   }
}

best method for implementing a TypeScript object

Answer №1

Answer №2

Similar questions

Tips for using Angular's formatDate function to format dates

Enhancing search capabilities in Angular 8.1.2 by filtering nested objects

What is the best way to determine a comprehensive map of every sub-store, their functions, and what data they contain?

Creating validation for an autosave reactive form in Angular 2: A step-by-step guide

I'm looking to display the message between the specified start date and end date that is selected in the input field

Scrolling horizontally in Ionic framework

angular pipe and tap methods fail to execute the designated function

Tips for altering Koa's HTTP status code for undeclared paths

Only filter the array by its value if the value is specified

Tips for managing the output of an asynchronous function in TypeScript

Warning: Node encountering unexpected Unhandled Promise Rejection ERROR

Develop a new flow by generating string literals as types from existing types

What are some ways to specialize a generic class during its creation in TypeScript?

What are the differences between TypeScript's 'Dictionary' type accessors for objects and objects with predefined members?

Attempting to assign the object retrieved from the interface as the new value for window.location.href

What causes an Angular Form to be validated before I even click the Submit button?

What is the process for creating a default button in Ionic framework?

pull information from mongodb into angular

Looking to display the ng-option in two lines within Angular 6?

Display an array depending on the value in Angular 2 when clicked