Receive data from multiple observables in Angular

I have 2 services. Both services have individual subjects and I am exposing both of them to other components by returning asObservable. Both have an addDataN function and both are emitting data to respecting subjects in services by on subject,so the getdataN method which is also emitting data on subject.

Now at the consumer side I am receiving two services completely independent. In component I am subscribing to the Listener, which are returning asObservable, and getdataN funnction, which are emitting data

Serv1

  getdata1() {
    this.http.get<{message:string,Data1:any}>('http://localhost:3000/api/1')
      .pipe(map((data1)=>{
        return Data1.Data1.map(data=>{
          return  {
            id: data._id,
            data1Title:data1.data1Title,
          }
        })
      })).subscribe((data1) => {
        this.data1=data1
        this.serv1Subject.next([...this.data1])
      })
  }
  addData1(){
       this.http.post<{message:string,Data1:any}>('http://localhost:3000/api/1',dataObject)
       .subscribe((data)=>{
           this.data1=data1
        this.serv1Subject.next([...this.data1])
       })
  }

  getData1Listener() {
    return this.serv1Subject.asObservable()
  }

Serv2

  getdata1() {
    this.http.get<{message:string,Data2:any}>('http://localhost:3000/api/2')
      .pipe(map((data1)=>{
        return Data2.Data2.map(data=>{
          return  {
            id: data._id,
            data1Title:data1.data1Title,
          }
        })
      })).subscribe((data1) => {
        this.data1=data1
        this.serv2Subject.next([...this.data1])
      })
  }
  addData2(){
       this.http.post<{message:string,Data2:any}>('http://localhost:3000/api/2',dataObject)
       .subscribe((data)=>{
           this.data1=data1
        this.serv2Subject.next([...this.data1])
       })
  }

  getData2Listener() {
    return this.serv2Subject.asObservable()
  }

Now at consumer component at ngOnInit at beginning I want to make sure that both subjects emit data and perform function x on data received from both end. And after that both work independently.

        ngOnInit(){
            this.serv1.getdata1()
            this.serv2.getdata2()
        combineLatest(this.serv1.getData1Listener(), this.serv2.getData2Listener())
.subscribe(([data1,data2])=>{function x(){
    something with data1,data2
    }})
    }

My Problem is with zip at beginning. Both work fine at beginning as both services emit, but after emitting data to serv1 the other is not emitted anything so it stuck there.

In withLatestFrom only recent data is received and I want to avoid spread operator

Is there any way I can cleanly implement this?

Any help is appreciated.