0

I have data service which returns fake data as json (private mockData function). Since json data structure matches MyPerson object I'm trying to cast that json data to MyPerson object simple using .map(res => res as MyPerson)); This doesn't work cause I'm getting error that data cannot be converted to MyPerson object.

My question is: how can I map this json data to MyPerson object using map function?

@Injectable()
export class DataService {
    person: MyPerson;

    constructor(private http: Http) {
        this.person = new MyPerson();
    }

    getData(): Observable<MyPerson> {
        return Observable.from([this.mockData()]
            .map(res => res as MyPerson)); /// ERROR?
    }

    private mockData() {
        return {
            "Id": 100,
            "firstName": "John",
            "lastName": "Conor",         
            "address": {
                "postalAddress": {
                    "Streetline": "Long street",
                    "Suburb": "some suburb",
                    "City": "Boston",
                    "Province": "MA"
                },
                "residentialAddress": {
                    "Streetline": "Short street",
                    "Suburb": "my suburb",
                    "City": "New Jersey",
                    "Province": "N/A"
                }
            },
            "Status": OK            
        }
    };
}

 export class MyPerson {
        Id: number;    
        firstName: string;
        lastName: string;    
        address: {
            residentalAddress: Address;
            postalAddress: Address;
        }    
    }

export class Address {    
    public StreetAddress: string;
    public Suburb: string;
    public City: string;
    public Province: string;

    constructor(street: string, suburb: string, city: string, province: string){
        this.StreetAddress = street;
        this.Suburb = suburb;
        this.City = city;
        this.Province = province;
    }
}
3
  • You could use .map(res => Object.assign(new MyPerson, res)); Commented Nov 28, 2017 at 19:47
  • @trincot thanks, I would say this works but I'm having problem with address property. ERROR Error: Uncaught (in promise): TypeError: Cannot set property 'postalAddress' of undefined. Commented Nov 28, 2017 at 19:50
  • that error means that your "address" key on the new myPerson object is not defined. Commented Nov 28, 2017 at 19:53

2 Answers 2

1

You're missing an i in residentialAddress in the MyPerson class, and you're using StreetLine instead of StreetAddress in your mock data. Fixed in stackblitz

Sign up to request clarification or add additional context in comments.

Comments

0

If you define the return type of the private mockData(): MyPerson, that will tell Typescript you know and have control on what data is being returned and doesn’t need to figure it out by trying to infer the type.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.