fix: check includes on init and known reference issues (#516)

.changeset/young-buttons-cross.md

@@ -0,0 +1,5 @@
+---
+"@alauda/ui": patch
+---
+
+fix: check includes on init and known reference issues

src/anchor/anchor.component.ts

@@ -26,7 +26,6 @@ import {
 import { buildBem, isTemplateRef, last } from '../utils';
 
 import { AnchorDirectiveChild } from './anchor.directive';
-import { AnchorModule } from './anchor.module';
 import { AnchorItem, AnchorTreeItem } from './types';
 import { getAnchorTreeItems } from './utils';
 
@@ -38,7 +37,7 @@ const bem = buildBem('aui-anchor');
   encapsulation: ViewEncapsulation.None,
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
-  imports: [NgFor, NgIf, NgTemplateOutlet, AnchorModule],
+  imports: [NgFor, NgIf, NgTemplateOutlet],
 })
 export class AnchorTreeComponent
   extends AnchorDirectiveChild

src/paginator/paginator.component.spec.ts

@@ -2,8 +2,6 @@ import { Component, DebugElement, ViewChild } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 
-import { SelectComponent } from '../select/select.component';
-
 import { PaginatorComponent } from './paginator.component';
 
 describe('PaginatorComponent', () => {
@@ -116,11 +114,7 @@ describe('PaginatorComponent', () => {
     </aui-paginator>
   `,
   standalone: true,
-  imports: [
-    PaginatorComponent,
-    // https://github.com/angular/angular/issues/51568
-    SelectComponent,
-  ],
+  imports: [PaginatorComponent],
 })
 class TestComponent {
   currentPage = 1;

src/select/base-select.ts

@@ -12,6 +12,7 @@ import {
   QueryList,
   ViewChild,
   ViewChildren,
+  forwardRef,
 } from '@angular/core';
 import {
   BehaviorSubject,
@@ -143,10 +144,10 @@ export abstract class BaseSelect<T, V = T>
   @ContentChild(OptionContentDirective)
   protected optionContent?: OptionContentDirective;
 
-  @ViewChildren(OptionComponent)
+  @ViewChildren(forwardRef(() => OptionComponent))
   customOptions: QueryList<OptionComponent<T>>;
 
-  @ContentChildren(OptionComponent, { descendants: true })
+  @ContentChildren(forwardRef(() => OptionComponent), { descendants: true })
   contentOptions: QueryList<OptionComponent<T>>;
 
   isTemplateRef = isTemplateRef;

src/select/validators.ts

@@ -6,13 +6,13 @@ import {
   Validator,
   ValidatorFn,
 } from '@angular/forms';
+import { startWith } from 'rxjs';
 
 import { coerceAttrBoolean } from '../utils';
 
 import { SelectComponent } from './select.component';
 import { TrackFn } from './select.types';
 
-// @dynamic
 // eslint-disable-next-line @typescript-eslint/no-extraneous-class
 export class AuiSelectValidators {
   static includes<T>(
@@ -64,11 +64,13 @@ export class IncludesDirective<T> implements Validator, AfterContentInit {
   constructor(private readonly selectRef: SelectComponent<T>) {}
 
   ngAfterContentInit() {
-    this.selectRef.contentOptions.changes.subscribe(() => {
-      if (this.onValidatorChange) {
-        this.onValidatorChange();
-      }
-    });
+    this.selectRef.contentOptions.changes
+      .pipe(startWith(this.selectRef.contentOptions))
+      .subscribe(() => {
+        if (this.onValidatorChange) {
+          this.onValidatorChange();
+        }
+      });
   }
 
   registerOnValidatorChange(fn: () => void) {