提问者:小点点

number类型的输入字段不显示默认值(角度)


我在stock-status.component.ts文件中有以下代码

@Component({
  selector: 'app-stock-status',
  template:`
  <input type="number" value='0' min='0' required [(ngModel)]='updatedStockValue'/>
  <button class="btn btn-primary" [style.background]='color' (click)='stockValueChanged()'>Change Stock Value</button>
    
  `,
  styleUrls: ['./stock-status.component.css']
})

正如您在图像中看到的,它没有显示默认值为0,请在此处输入图像描述

当没有初始化数据时,只要单击按钮,它就会显示不是我想要的NaN

欢迎任何形式的帮助和指导


共2个答案

匿名用户

NGModel绑定在这里可能具有优先级。 您可以忽略value属性,并在其定义中设置UpdatedStockValue

请尝试以下操作

@Component({
  selector: 'app-stock-status',
  template:`
  <input type="number" min="0" required [(ngModel)]="updatedStockValue"/>
  <button class="btn btn-primary" [style.background]="color" (click)="stockValueChanged()">Change Stock Value</button>
    
  `,
  styleUrls: ['./stock-status.component.css']
})
export class AppComponent {
  updatedStockValue: number = 0;
  ...
}

匿名用户

如果不想在控制器中初始化变量,可以使用ng-init初始化模板中的变量。

  <input type="number" min='0' required [(ngModel)]='updatedStockValue'
  ng-init="updatedStockValue=0"/>