Explicitly set standalone for all Angular directives

Angular v19 is going to change the default value for `standalone` from `false` to `true`. Even though tensorboard is on an older version of Angular on GitHub, the version inside Google runs at HEAD. We're in the process of changing existing code in google to explicitly set `standalone: false` for existing code, so I'm sending this change to the source of truth here.

This is a follow-up to #6912, which missed a handful of places.

tensorboard/webapp/app_routing/effects/app_routing_effects_test.ts

@@ -48,7 +48,7 @@ import {
 } from '../types';
 import {AppRoutingEffects, TEST_ONLY} from './app_routing_effects';
 
-@Component({selector: 'test', template: '', jit: true})
+@Component({standalone: false, selector: 'test', template: '', jit: true})
 class TestableComponent {}
 
 const testAction = createAction('[TEST] test action');

tensorboard/webapp/app_routing/route_config_test.ts

@@ -19,7 +19,7 @@ import {RouteConfigs, RouteMatch} from './route_config';
 import {ConcreteRouteDef, RedirectionRouteDef} from './route_config_types';
 import {Navigation, RouteKind} from './types';
 
-@Component({selector: 'test', template: ''})
+@Component({standalone: false, selector: 'test', template: ''})
 class TestableComponent {}
 
 function buildConcreteRouteDef(override: Partial<ConcreteRouteDef>) {

tensorboard/webapp/app_routing/views/router_link_directive_container.ts

@@ -19,7 +19,10 @@ import {navigationRequested} from '../actions';
 import {AppRootProvider} from '../app_root';
 import {Location} from '../location';
 
-@Directive({selector: 'a[routerLink]'})
+@Directive({
+  standalone: false,
+  selector: 'a[routerLink]',
+})
 export class RouterLinkDirectiveContainer {
   private pathname: string | null = null;
 

tensorboard/webapp/feature_flag/directives/feature_flag_directive.ts

@@ -27,7 +27,10 @@ import {FEATURE_FLAGS_QUERY_STRING_NAME} from '../http/const';
 import {getFeatureFlagsToSendToServer} from '../store/feature_flag_selectors';
 import {State as FeatureFlagState} from '../store/feature_flag_types';
 
-@Directive({selector: 'a[includeFeatureFlags], img[includeFeatureFlags]'})
+@Directive({
+  standalone: false,
+  selector: 'a[includeFeatureFlags], img[includeFeatureFlags]',
+})
 export class FeatureFlagDirective {
   @HostBinding('attr.href') hrefAttr: string | undefined = undefined;
   @HostBinding('attr.src') srcAttr: string | undefined = undefined;

tensorboard/webapp/metrics/views/main_view/card_grid_test.ts

@@ -82,7 +82,7 @@ class TestableScrollingContainer {
 /**
  * Stub 'card-view' component for ease of testing.
  */
-@Component({selector: 'card-view'})
+@Component({standalone: false, selector: 'card-view'})
 class TestableCardView {
   @Output() fullHeightChanged = new EventEmitter<boolean>();
   @Output() fullWidthChanged = new EventEmitter<boolean>();

tensorboard/webapp/widgets/intersection_observer/intersection_observer_directive.ts

@@ -29,7 +29,10 @@ import {take, takeUntil} from 'rxjs/operators';
 /**
  * A directive that calls `onVisibilityChange` when element visiblity changes.
  */
-@Directive({selector: '[observeIntersection]'})
+@Directive({
+  standalone: false,
+  selector: '[observeIntersection]',
+})
 export class IntersectionObserverDirective implements OnInit, OnDestroy {
   @Input() intersectionObserverMargin?: string;
   @Output() onVisibilityChange = new EventEmitter<{visible: boolean}>();

tensorboard/webapp/widgets/intersection_observer/intersection_observer_testing_module.ts

@@ -16,7 +16,11 @@ import {Directive, EventEmitter, NgModule, Output} from '@angular/core';
 import {ComponentFixture} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 
-@Directive({selector: '[observeIntersection]', jit: true})
+@Directive({
+  standalone: false,
+  selector: '[observeIntersection]',
+  jit: true,
+})
 class IntersectionObserverTestingDirective {
   @Output() onVisibilityChange = new EventEmitter<{visible: boolean}>();
 

tensorboard/webapp/widgets/resize_detector_directive.ts

@@ -29,7 +29,10 @@ import {debounceTime, skip, takeUntil} from 'rxjs/operators';
  *
  * It does not emit `onResize` on the initial render.
  */
-@Directive({selector: '[detectResize]'})
+@Directive({
+  standalone: false,
+  selector: '[detectResize]',
+})
 export class ResizeDetectorDirective implements OnDestroy, OnInit {
   @Input() resizeEventDebouncePeriodInMs: number = 100;
   @Output() onResize = new EventEmitter<void>();

tensorboard/webapp/widgets/resize_detector_testing_module.ts

@@ -16,7 +16,10 @@ import {Directive, EventEmitter, Input, NgModule, Output} from '@angular/core';
 import {ComponentFixture} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 
-@Directive({selector: '[detectResize]'})
+@Directive({
+  standalone: false,
+  selector: '[detectResize]',
+})
 class ResizeDetectorTestingDirective {
   @Input() resizeEventDebouncePeriodInMs: number = 100;
   @Output() onResize = new EventEmitter<void>();