我在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
欢迎任何形式的帮助和指导
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"/>