我强烈建议您使用这个自定义指令，而不是使用css。

import { Directive, ElementRef, OnInit } from "@angular/core";

@Directive({
  selector: "[header-less-tabs]",
})
export class HeaderLessTabsDirective implements OnInit {
  constructor(private eleRef: ElementRef) {}

  ngOnInit(): void {
    this.eleRef.nativeElement.children[0].style.display = "none";
  }
}

这是非常简单和可重用的。用法示例：

<mat-tab-group header-less-tabs>
    <mat-tab>
        <mat-tab-group>
            <mat-tab>
            </mat-tab>
        </mat-tab-group>
    </mat-tab>
</mat-tab-group>

想明白了，只要选择直系子女

<mat-tab-group class="invisible-tabs">
    <mat-tab>
        <mat-tab-group>
            <mat-tab>
            </mat-tab>
        </mat-tab-group>
    </mat-tab>
</mat-tab-group>

.invisible-tabs {
  > .mat-tab-header {
    display: none;
  }
}

简单的替代解决方案：
将以下内容添加到组件css文件中：

::ng-deep .mat-tab-header {
display: none!important;
}

使用ng：deep的另一种替代解决方案

<mat-tab-group >
            <mat-tab class="invisible-tabs">
                    </mat-tab>
        
                    <mat-tab class="invisible-tabs">
                    </mat-tab>
        </mat-tab-group>

    <!-- in css file -->
    .invisible-tabs {
          ::ng-deep .mat-tab-header {
            display: none !important;
          }
        }