fix(material/tabs): resolve change after checked errors

Fixes some "change after checked" errors in the tab nav bar.

Author: crisbeto

goldens/material/tabs/index.api.md

@@ -401,7 +401,8 @@ export class MatTabLink extends InkBarItem implements AfterViewInit, OnDestroy,
     get active(): boolean;
     set active(value: boolean);
     disabled: boolean;
-    disableRipple: boolean;
+    get disableRipple(): boolean;
+    set disableRipple(value: boolean);
     // (undocumented)
     elementRef: ElementRef<any>;
     focus(): void;
@@ -452,7 +453,8 @@ export class MatTabNav extends MatPaginatedTabHeader implements AfterContentInit
     get backgroundColor(): ThemePalette;
     set backgroundColor(value: ThemePalette);
     color: ThemePalette;
-    disableRipple: boolean;
+    get disableRipple(): boolean;
+    set disableRipple(value: boolean);
     get fitInkBarToContent(): boolean;
     set fitInkBarToContent(value: boolean);
     // (undocumented)

src/material/tabs/tab-nav-bar/tab-nav-bar.spec.ts

@@ -7,15 +7,7 @@ import {
   dispatchMouseEvent,
   provideFakeDirectionality,
 } from '@angular/cdk/testing/private';
-import {
-  Component,
-  provideCheckNoChangesConfig,
-  QueryList,
-  signal,
-  ViewChild,
-  ViewChildren,
-  WritableSignal,
-} from '@angular/core';
+import {Component, QueryList, signal, ViewChild, ViewChildren, WritableSignal} from '@angular/core';
 import {ComponentFixture, fakeAsync, TestBed, tick, waitForAsync} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 import {Subject} from 'rxjs';
@@ -41,7 +33,6 @@ describe('MatTabNavBar', () => {
         TabBarWithInactiveTabsOnInit,
       ],
       providers: [
-        provideCheckNoChangesConfig({exhaustive: false}),
         {provide: MAT_RIPPLE_GLOBAL_OPTIONS, useFactory: () => globalRippleOptions},
         provideFakeDirectionality(dir),
       ],

src/material/tabs/tab-nav-bar/tab-nav-bar.ts

@@ -131,7 +131,13 @@ export class MatTabNav extends MatPaginatedTabHeader implements AfterContentInit
 
   /** Whether the ripple effect is disabled or not. */
   @Input({transform: booleanAttribute})
-  disableRipple: boolean = false;
+  get disableRipple() {
+    return this._disableRipple();
+  }
+  set disableRipple(value: boolean) {
+    this._disableRipple.set(value);
+  }
+  private _disableRipple = signal(false);
 
   /**
    * Theme color of the nav bar. This API is supported in M2 themes only, it has
@@ -297,7 +303,13 @@ export class MatTabLink
 
   /** Whether ripples are disabled on the tab link. */
   @Input({transform: booleanAttribute})
-  disableRipple: boolean = false;
+  get disableRipple() {
+    return this._disableRipple();
+  }
+  set disableRipple(value: boolean) {
+    this._disableRipple.set(value);
+  }
+  private _disableRipple = signal(false);
 
   @Input({
     transform: (value: unknown) => (value == null ? 0 : numberAttribute(value)),