Как [(ngModel)] привязать значение по умолчанию [selected] ‹option› в ‹select›, ЕСЛИ пользователь не выбрал какой-либо параметр для ‹select› в строке поиска с несколькими фильтрами

проблема в том, что не обязательно использовать все поля ввода или выбирать теги одновременно для фильтрации, поэтому иногда пользователи могут оставить один или несколько фильтров, не выбирая или не размещая для них параметр / ввод. и в этом случае я хочу, чтобы мои теги select возвращали значение параметра по умолчанию [selected] = true при отправке запроса.

Когда я запускаю приложение, параметр [selected] = true отображается правильно в раскрывающемся списке выбора, но всякий раз, когда я пытаюсь отправить и запустить запрос, не выбирая какой-либо другой параметр, значение параметра [selected] = true не захватывается, что влияет на все запрос, и я должен выбрать / выбрать любой из параметров для каждого тега в строке поиска, даже если его параметр определен как [selected] = true, чтобы правильно получить значение, которое не является бездействующим для панели поиска фильтра, которую я пытаюсь строить и определенно не удобен для пользователя.

Я использую [(ngModel)] для привязки полей ввода или выбора параметров тега и уже установил значение параметра [selected] = true с помощью [value] =

Ниже изображения, показывающие и объясняющие случай

и вот мой упрощенный html файл

<div class="input-group mb-3">

    <select class="" name="numbers-list" [(ngModel)]="number" >
          <option [selected]="true" [value]="defaultValue"> Any </option>
          <option value="1"> 1 </option>
          <option value="2"> 2 </option>
          <option value="3"> 3 </option>
    </select>

    <button(click)="searchNumber()"></button>

</div>

вот упрощенный файл component.ts

import { Component, OnInit } from '@angular/core';
import {NumberService} from '../../services/numbers.service';


export class ListingsListComponent implements OnInit {
  
  list: any:
  number: any;
  defaultValue: any;
 

constructor(private numberService: NumberService) {}


searchNumber(): void {
    this.defaultValue = "Any"
    this.numberService.findByNumber(this.number)
      .subscribe(
        data => {
          this.list = data;
          console.log(data);
        },
        error => {
          console.log(error);
        });
  }
}

вот упрощенный служебный файл

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

const baseUrl = 'http://localhost:3000/numbers';

@Injectable({
  providedIn: 'root'
})
export class NumberService {



constructor(private http: HttpClient) { }

    findByNumber(number): Observable<any> {
    return this.http.get(`${baseUrl}?number=${number}`);
  }

}

Это изображение отображается первым, когда я запускаю приложение или обновляю браузер, оно автоматически показывает [выбранные] параметры < / а>

Второе изображение показывает, что происходит, когда я нажимаю кнопку для отправки запроса без выбора каких-либо параметров для тегов select. но только заполнение поля ввода &

Третье изображение показывает, что запрос работает и получает запрошенные данные только тогда, когда я вручную нажал и выбрал параметры, которые я хочу

поэтому запрос и все работает правильно, если я выбираю параметры и не оставляю их для параметров по умолчанию, и я хочу, чтобы если пользователь не выбрал параметр в одном из тегов, этот тег выбора должен автоматически предоставлять свое значение по умолчанию значение опций при отправке