You can disable animation using @.disabled property which is introduced in angular 4.3.1.

Either add below code to your component

@HostBinding('@.disabled') disabled = true

or in your html

<div [@.disabled]="expression"></div>

Here is working plnkr https://plnkr.co/edit/sVJM8H?p=preview

try this:

<mat-group [@.disabled]="true">
    <mat-tab label="one">one</mat-tab>
    <mat-tab label="two">two</mat-tab>
    <mat-tab label="three">three</mat-tab>
</mat-group> 

Another approach is a hackie with route navigation (find a place later to change returned value)

this.router.routeReuseStrategy.shouldReuseRoute = function() {
    return false;
};
this.router.navigate(['your-page', nextTabIndex]);

This will be same as *ngIf condition but also it's important to define a route param, e.g. :tab

{
   path: 'your-path/:tab',
   component: YourComponent
}

And of corse you should use <route-outlet></route-outlet>

And also it'll be nice to restore current tab on page reload

tab: number = 0;

constructor(public router: Router, public route: ActivatedRoute) {}

ngOnInit() {
    this.tab = this.route.snapshot.params['tab'];
}

onTab(event: MatTabChangeEvent) {
    this.tab = event.index;
    this.router.routeReuseStrategy.shouldReuseRoute = function() {
        return false;
    };
    const url = decodeURIComponent(this.router.url);
    this.router.navigate([url.substr(0, url.lastIndexOf("/")), event.index]);
}

And in html

<mat-tab-group [selectedIndex]="tab" (selectedTabChange)="onTab($event)"/>