Angular 5-Mat tab方法调用inside*ngFor get get executed multiple times

我怀疑当我在*ngFor中调用一个函数时,它会被执行多次,比数组中的元素还要多

     <mat-tab-group>
      <mat-tab  *ngFor="let tab of tabsName">
        <ng-template mat-tab-label>
          {{getTabName(tab)}}
          <span class="badge">{{getTabCount(tab)}}</span>
        </ng-template>
        <div *ngTemplateOutlet="comments"></div>
      </mat-tab>
    </mat-tab-group>  


    <ng-template #comments>
      <div class="col-sm-9 jj-pad-0">Deep</div>
</ng-template>

我想知道这是不是正确的行为?

选项卡名称:[{名称:'tab1',计数:'2'},{名称:'tab2',计数:'1'}]

export class TabsComponent implements OnInit {

  @Input() tabsName: any;
  @Input() template: TemplateRef<any>;
  @Output() tabSelected: EventEmitter<any> = new EventEmitter();

  constructor(private service: SomeService) {

  }

getTabName(tab): string {

    return this.service.configData[tab]['UILabel'];
  }

  getTabCount(tab): number {
    if (this.service.dataMap) {
      return this.service.dataMap.get(this.service.configData[tab]['dataType']).data.length;
    }
  }

  onSelect(event) {
    this.tabSelected.emit(event);
  }

}