如何修复 'string' 类型的参数不可分配给 'number' 类型的参数?

How to fix Argument of type 'string' is not assignable to parameter of type 'number'?

我想在我的数据库中保存不同类型的值,是新手 Angular 我不知道该怎么做,我的名字值很适合我的数据库而值nb_engins 无论如何总是空的。我正在尝试将它们分配给一个数组,这是正确的解决方案吗? 但它在我的背上有效

Visualisation.component.html

<div class="textbox">
        <input #flotteName placeholder="Name">
        
    </div>
    <div class="textbox">
    <input #flotteNbengins placeholder="nb_engins" type="number">
  </div>

    <input type="button"
           class="btn" 
           value="Add flotte" 
           (click)="add(
                      flotteName.value,
                      flotteNbengins.value                     
                    );
                    flotteName.value='';
                    flotteNbengins.value=''
                    ">
  </div>

Visualisation.component.ts

export class VisualisationComponent  implements OnInit {

  
  message: any;
  error: any;
  flottes: Array<Flotte> = [];


constructor(
  private api: ApiService,
  private flotteservice: FlotteService,
    private http: HttpClient,) {}


add(name: string, nb_engins: number ){

  name = name.trim();
  if (!name) { return; }

  if (!nb_engins) { return; }
 
  this.api.registerFlotte({ name, nb_engins} as Flotte)
    .subscribe(data => {
      this.flottes.push(data);
    });
}

api.service.ts

 registerFlotte(flotte: Flotte): Observable<Flotte>
 {
   

   return this.http.post<Flotte>(this.base_url, flotte,  { headers: this.httpHeaders });
 }

界面flotte.ts

export interface Flotte {
    id: number;
    name: string;
    nb_engins: number;
}

提前致谢

问题是 add(name: string, nb_engins: number ) 期望第二个参数 nb_engins 作为数字 但是 flotteNbengins.value 是一个字符串,因此它不允许分配以解决此问题,您可以将函数的参数更改为字符串或

<input
  type="button"
  class="btn"
  value="Add flotte"
  (click)="
    add(flotteName.value, flotteNbengins.valueAsNumber);
    flotteName.value='';
    flotteNbengins.value=''
  "
/>

这是一个工作演示 https://stackblitz.com/edit/angular-strict-mode-hkzrvb?file=src%2Fapp%2Fcomponents%2Fapp.component.ts,src%2Fapp%2Fcomponents%2Fapp.component.html