無法綁定到“ngValue”，因為它不是“option”的已知屬性 angular cli 13

Question

我在用戶界面上使用（Iuser）

<app-user [user]="user"></app-user>
<select (change)="onSelectChange($event.target.value)">
    <ng-container *ngFor="let user of users">
        <ng-container *ngIf="user.age>30">
            <option [ngValue]="user">
                {{user.name}} {{user.age}}
            </option>
        </ng-container>

    </ng-container>
</select>

它有 2 個錯誤：

1.

<select (change)="onSelectChange($event.target.value)">(Object is possibly 'null'.ngtsc(2531)
app.component.ts(3, 46): Error occurs in the template of component AppComponent.)

<option [ngValue]="user">(Can't bind to 'ngValue' since it isn't a known property of 'option'.ngtsc(-998002)
app.component.ts(3, 46): Error occurs in the template of component AppComponent.)

我在這里寫 mt user.ts 代碼

import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
import { IUser } from '../app-interface';

@Component({
  selector: 'app-user',
  templateUrl: './user.component.html',
  styleUrls: ['./user.component.css']
})
export class UserComponent implements OnInit  {

 
  private _user!: IUser;
  @Input()
  set user(user:IUser){
    this._user=user;
    this.cunter++;
  };

  
  public get user() :IUser{
    return this._user;
  }
  
 

  cunter:number=0;

  constructor() { }

  ngOnInit(): void {
    console.log(this._user);
    
  }
  
}

我不知道如何解決這個問題？

Answer 1

為防止錯誤 #1 添加感嘆號 (.) 以表明您知道它可能為空。

<select (change)="onSelectChange($event.target.value!)">

為防止錯誤 #2，請遵循 @Abru007 的建議：

<option [value]="user">