Angular service injection design-pattern with two services closely related

I have two service such as Service1 and Service2.

Both services are registered in AppModule(Root module).

Service2 is injected to Service1 like the below.

@Injectable()
class Service2{
  constructor(){}
  public foo(){}
}

and

@Injectable()
class Service1{
  constructor(public service2:Service2){
    this.service2.foo()
  }
}

And, a component needs Service1 and function foo() of Service2.

In this point, I have a question about design-pattern injecting those services to components. I think there are two ways to achieve my goal.

Pattern 1

@Component()
class Component{
  constructor(
    public service1:Service1
    ,public service2:Service2
  ){
    this.service2.foo()
  }
}

Pattern 2

@Component()
class Component{
  constructor(
    public service1:Service1
  ){
    this.service1.service2.foo()
  }
}

I think Pattern 2 is better because of simplicity.

So, which one is better? Or is there Any other Suggestion?