Map 2 json file Object together with the key

[Vinu Prasad]

Hii... Everyone , I am using Angular4. I have to map 2 json file objects based on the key and stored into a third object. All other operations are performed based on these third object.
json1
[
  {
     "p1" : "Apple",
     "p2" : "Grape"
  }
]

json2
[
  {
    "p1":"Red",
    "p2":"Violet"
  }
]

I want to map these json files into a third object and access with this object
i want to become
[
  {
    "Apple":"Red",
   "Grape":"Violet"
  }
]
 iused this code for doing this:

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

import { Http, Response, Headers, RequestOptions } from '@angular/http';

import { Observable } from 'rxjs/Rx';

//import { parse } from '@types/parse';

import 'rxjs/add/operator/map';

import 'rxjs/add/operator/zip';

import 'rxjs/add/operator/toPromise';

import { map } from 'rxjs/operator/map';

import { parse } from 'querystring';

@Injectable()

export class SettingsService {

// public ah: Object;

// public obj1: string;

public obj1

public obj2

data = this.http.get('http://192.168.0.102:8000/json1')

.map(response => { this.obj1 = response.json()

})

.zip(

this.http.get('http://192.168.0.102:8000/json2')

.map(response => { this.obj2 = response.json()

this.serve(this.obj1,this.obj2);

}))

serve(obj1,obj2){

for(let i in obj1){

///

HOW CAN I MAP THESE TWO JSON OBJECTS INTO ONE BY JOINING TOGETHER WITH THE CORRESPONDING MediaKeySession

//

}

}

constructor(private http : Http) {

}

getData(): Promise<any>{

return this.data.toPromise();

}

}

[Vinu Prasad]

HOW CAN I MAP THESE TWO JSON OBJECTS INTO ONE BY JOINING TOGETHER WITH THE CORRESPONDING key-value